제안) Framework: next 이유) 처음에는 라이러리 react 로만 구현해도 상관 없을 거라 생각 했는데, 블로그의 특성상 검색 노출이 중요하고 정적인 컨텐츠 노출이 많다는 점에서, next js로 서버 사이드 렌더링 SEO 최적화 및 정적 생성 (Static Generation)으로 성능 향상이 가능하며 추가로 next js 에 대해 조금이라도 더 알고싶은 바램이 있어 제안 요청합니다!

seungdeok commented 2 months ago

언어

typescript

패키지매니저(npm, yarn, pnpm)

yarn berry v4

번들러(webpack, vite)

next default 사용

Framework & Library(react, next)

next@latest app router

Styling(css in js, css)

[ ] Chakra UI -> SSR 미지원
[x] Radix -> 결정
[ ] NextUI -> 커뮤니티나 컴포넌트가 아직은 개발 중

상태관리

Client

[x] zustand(https://www.npmjs.com/package/zustand)
[ ] recoil(https://www.npmjs.com/package/recoil)

Server

TanStack Query

애니메이션

[x] Framer motion -> 반박불가

타입검사

[x] zod

코드 및 구조

[x] eslint
[x] prettier
[ ] stylelint -> UI라이브러리 사용하므로 불필요
[ ] editorconfig -> 내부 기여자들이 같은 에디터 사용
[x] nvm

호스팅

[x] EC2
[ ] Vercel
[ ] 개인 컴퓨터
[ ] S3
[ ] Github Pages
[ ] AWS Beanstalk

새로운 EC2 instance로 결정 -> DB 사용 가능성과 대시보드 및 관리측면에서 현재 사용하고 있는 EC2 서비스를 사용

Domain

기존에 구입해두었던 도메인의 서브 도메인을 활용 *.fin-hub.co.kr
tech-blog.fin-hub.co.kr으로 결정

Testing(storybook, msw, jest, RTL, cypress, playwright)

[x] storybook
테스팅이 필요한데 추후 결정

로깅

Sentry -> next api webhook -> slack

fotcamp / tech-blog

Step1 기술스택 및 개발환경 공유 #2

기술스택

언어(js, ts)

패키지매니저(npm, yarn, pnpm)

번들러(webpack, vite)

Framework & Library(react, next)

Styling(css in js, css)

Testing(storybook, msw, jest)

로깅(sentry)

배포(github pages, s3, vercel)

개발환경

타겟 브라우저 및 디바이스(chrome, safari, edge, mobile)

코드 컨벤션(naming, import order, folder)

ETC

언어

패키지매니저(npm, yarn, pnpm)

번들러(webpack, vite)

Framework & Library(react, next)

Styling(css in js, css)

상태관리

Client

Server

애니메이션

타입검사

코드 및 구조

호스팅

Domain

Testing(storybook, msw, jest, RTL, cypress, playwright)

로깅