Dog foot print

React 로 Calendar app만들기 - 5 클릭 한 날짜 표시하기 금일은 클릭하거나 최초 RCA 마운트 시 오늘에 해당하는 날에 Day컴포넌트에 색상을 다르게 해주는 작업을 할 것입니다. 그리고 캘린더에서 이번 달이아닌 부분을 클릭하게 되면 해당 달력으로 이동되게 끔 할 예정입니다. /src/App.js import React, { Component } from 'react' import Header from './Header' import Calendar from './Calendar' import moment from 'moment' import './style/RCA.css' export default class App extends Component { state = { calendarYM..

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