스택 선정

SSR vs CSR

velog의 특성상 작성된 글에 다른 사용자들의 유입이 필요하기 때문에 SEO에 유리한 SSR을 선택. CSR도 meta tag를 이용해 구글봇 유입이 가능하지만, 우리는 국내 서비스이므로 네이버나 카카오 등의 검색엔진에도 반영되어야 함.

Stack

React
- react-hooks
  
  → 우리가 리엑트 훅을 사용해야 하는 이유
  
  → https://surviveasdev.tistory.com/entry/React-hook이-나온-이유와-사용해야-하는-이유
Next.js(SSR)
- next.js에서는 스타일을 적용시키기 위해 styled-jsx 언어를 사용. 이를 "CSS-in-JS" 라고 하는데, 같은 라이브러리로 styled-component / Emotion 등이 있다.
- CSR의 단점인 초기 렌더링 속도가 느린것을 방지하기 위함과 SEO를 위해 SSR 을 선택
styled-component or SASS 선택 회의 예정

styled-component SASS

파일이 하나다 음.. 굳이?

props 사용 가능

jest로 테스트 가능

next.js에서 사용 가능

Axios

Axios	Fetch
Axios has url in request object.	Fetch has no url in request object.
Axios is a stand-alone third party package that can be easily installed.	Fetch is built into most modern browsers; no installation is required as such.
Axios enjoys built-in XSRF protection.	Fetch does not.
Axios uses the data property.	Fetch uses the body property.
Axios’ data contains the object.	Fetch’s body has to be stringified.
Axios request is ok when status is 200 and statusText is ‘OK’.	Fetch request is ok when response object contains the ok property.
Axios performs automatic transforms of JSON data.	Fetch is a two-step process when handling JSON data- first, to make the actual request; second, to call the .json() method on the response.
Axios allows cancelling request and request timeout.	Fetch does not.
Axios has the ability to intercept HTTP requests.	Fetch, by default, doesn’t provide a way to intercept requests.
Axios has built-in support for download progress.	Fetch does not support upload progress.
Axios has wide browser support.	Fetch only supports Chrome 42+, Firefox 39+, Edge 14+, and Safari 10.1+ (This is known as Backward Compatibility).

전역 상태 관리 도구 : redux / recoil & react-query / mobx / context-api

→ 리코일로 갈아타려다 리덕스로 돌아온 부메랑

→ https://www.facebook.com/groups/react.ko/permalink/2835701603356660/

https://velog.io/@cada/React-Redux-vs-Context-API
node-js(express.js)

→ 스프링쓰기에는 우리 프로젝트가 그렇게 무겁지가 않아서... 익스프레스가 나은듯

→ 프론트 개발자로서 node.js 프레임워크 사용을 선호합니다.

→ faker.js로 mock 데이터를 만들어 프론트 개발 후, 백 연결
DB

→ 마이에스큐엘이나 몽고디비.. 이유는 음.. 생각해보자! //조은님께 조은 조언

What is the MERN Stack? Introduction & Examples
Typescript

Prettier

폴더 세팅

aws 엔플리튜드 (로그인 로그아웃)

파이어베이스