Dog foot print

회사는 바삐 돌아가고, 공부 할 내용은 많아, 기획 되어있던 시리즈가 진도를 못나가고 있다. 그래서 많은 이들이 실수 할 만한 내용에 대해서 작성해보려 한다. 이 내용은 타입스크립트로 작성되어 있는 함수형 컴포넌트를 사용하지만, REACT의 특징을 어느정도 익힌 사람이라면 이해 할 수 있도록 작성되어 있다. Map 을 통한 컴포넌트로의 매핑 Map 메서드는 배열을 재구성하는 용도로 사용되는 배열 메서드이다. 배열 타입이라면 map 메서드를 가지고 있다. 혹시라도 map 메서드가 익숙하지 않은 사람을 위해 간단한 예를 들어보자 . Common.js에서의 사용 const numbers = [1,2,3,4,5]; const addedTwoInNumbers = numbers.map((number)=>{ retu..

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는 날짜와 시간에 관련된 라..