Dog foot print

React로 Calendar app만들기 -3 Calendar container 요일 표시하기 이번 작업은 요일을 표시하는 Datehead component를 작업할 예정입니다. 현재 우리의 달력 app은 한글로 이루어져 있지만 사용자에 따라 영어로 sun, mon, tue, wed, thu, fri, sat,로 표현도 가능하고 한자로 日, 月, 火, 水, 木, 金, 土 로 표현 가능합니다. 그렇기에 개발자의 편의성을 위하여 Dateheader component로 요일에 대한 표현을 전달하면 요일을 표시하도록 구상했습니다. 이 과정에서 생각해볼 수 있는 것은 다형성의 원칙으로 인하여 “sun, mon, tue, wed, thu, fri, sat”도 요일을 모은 표시 형식이며, [‘sun’, ‘mon’, ..

React로 Calendar app만들기 기본 세팅 Yarn create react-app calendar로 적당한 위치에 react-project를 만든다. 기본 세팅을 위해서 필요 없는 것들을 src폴더에서 삭제하고 App.js를 Calendar.js 로 변경 한다. Calendar는 Class형 컴포넌트로 변경하고 테스트를 위해 Hello Calendar를 입력한다. import React, { Component } from 'react' export default class Calendar extends Component { render() { return ( Hello Calendar ) } } export default Calendar; index.js도 아직 붙어 있는 service work..

React를 이용한 Calendar Application 만들기 서문 생각 보다 바닐라 JS를 이용한 calendar 만들기가 인기 있어 REACT를 활용한 Calendar app을 만들기를 구상하게 되었습니다. 올 해 2020년 생각지도 못한 국가근로 및 코로나 사태로 많은 스트레스를 받아 포스팅을 중지 했었습니다. 그렇지만 Jasmin 회원들과 무럭 무럭 커가는 대한민국의 프로그래머 꿈나무에게 좀 더 도움이 되고자, 다시 포스팅을 시작 하도록 마음 먹었습니다. 개요 해당 Calendar Application은 사용자에게 달력을 제공 해줌으로써, 주말과 공휴일 그리고 현재 날짜를 구분하고 이번 달의 끝과 시작을 구분 할 수 있도록한다. 사용하는 lib Moment Moment는 날짜와 시간에 관련된 라..