FE/코딩일기

🌳7월3일 TIL🎶

❓ Route 세팅 BrowerRouter를 사용하여 경로별로 route를 세팅해주었다.//App.tsx }> }> item을 클릭하면 onItemClick 함수를 통해 /theme/:themeKey 로 페이지 이동 {items.map((item, index) => ( onItemClick('life_small_gift')}> {item.category} ))}이때, 중복된 타입을 가진 아이템들이 여러 개 존재하므로 items.ts 에 별도로 타입을 정의했다. 현재 주어진 요구사항에서는 각 카테고리 아이템의 이미지가 동일하지만 추후에 각 카테고리에 따른 이미지가 달라진다면, 하나의 파일에서 편리하게 관리할 수 있을 것 같다.import itemIm..

🌳7월2일 TIL🎶

Emotion 라이브러리 설치📌 Emotion: 대표적인 CSS in JS 라이브러리 JS 안에서 CSS를 만들기 때문에 State에 맞게 동적으로 CSS를 변경할 수 있다.emotion/styled?The @emotion/styled package is for those who prefer to use the styled.div style API for creating components.styled.div사용을 선호하는 경우에 style API를 사용하면 된다. 나같은 경우도 div 태그를 자주 사용하게 될 것 같아서 emotion/styled 설치를 바로 진행했다. $npm i --save @emotion/react @emotion/styled Reset CSS란?📌 Reset CSS란 브라우저..

🌳7월1일 TIL🎶

🚀CRA를 사용한 프로젝트 세팅저번 주차 과제로 CRA(Create React App)을 사용하여 프로젝트를 세팅했다.출국을 코앞에 두고 급하게 진행했던터라, 여러 에러들을 마주했지만 차근차근 해결하지 못해 아쉬움이 남았다.오늘 코딩일기는 멘토님께 받은 피드백 위주로 기록을 해보려한다.📍dependencies와 devDependencies에는 어떤 차이가 있을까?dependencies에는 애플리케이션 동작과 직접적으로 연관된 라이브러리를 설치한다.npm install 라이브러리명devDependencies에는 프로그램 동작과 직접적인 연관은 없지만, 개발할 때 필요한 라이브러리를 설치한다. devDependencies에 설치된 라이브러리는 배포할 때 포함되지 않는다. eslint와 prettier와 ..