React와 Vite

CRA(create react app)

npx create-react-app my-app --template typescript
타입스크립트로 CRA프로젝트 생성방법
Webpack과 Babel과 같은 도구의 설정을 수동으로 수행할 필요가 없다.
Node.js와 express기반이다.

Vite

npm create vite@latest my-app -- --template react-ts
타입스크립트로 Vite 프로젝트 생성방법
Rollup과 같은 모듈 번들러를 사용하여 빌드 시간을 최소화하고, 애플리케이션의 성능을 향상시킨다.
Golang과 koa기반이다.

Global Style

• global = 프로젝트 전체에 적용 즉, 프로젝트에 일관된 스타일링 적용
• "user agent stylesheet"로 표시되는 브라우저의 기본 스타일이 차이를 만든다.
• 브라우저 간의 스타일 차이를 극복하기 위해 사용

css-in-js를 사용하는 이유

• 전역 충돌
• 의존성 관리 어려움
• 불필요한 코드, 오버라이딩
• 압축
• 상태 공유 어려움
• 순서와 명시도
• 캡슐화

theme 사용 이유

• UI,UX의 일관성 유지
• 유지보수가 용이
• 확장성
• 재사용성
• 사용자 정의