HomeAboutMeBlogGuest
© 2025 Sejin Cha. All rights reserved.
Built with Next.js, deployed on Vercel
🤎
프론트엔드 데브코스 5기 교육생
/
💻
이세희팀
/
🚀
팀프로젝트 : Styled
/
📜
회의록
/
✏️
20231222 테마 및 기술 스택 회의
✏️

20231222 테마 및 기술 스택 회의

기능 테스크 정리 및 칸반 보드 설정
테마 정하기 : 사용자는 누구인지, 어떤 테마로 할 것 인지, 채널 활용 방식도 고려 (12.22까지)
  • 맛집(익준) 게시물 : { 제목, 내용: 음식 사진, 내부 사진, 맛집 사이트url(네이버지도, 구글지도 url), 주차 여부, 영업 시간, 꿀팁, 평점}
  • 겹치는 관심사(재웅), 두 개 이상 관심사 겹치는 사람을 모아주는, 여러 개 채널 추가 api 활용 고려
  • 요리 레시피 공유(승민)
    • 대상: 자취생, 요리하는 사람, 베이킹
    • 레시피 소개하기.. 간단 자취 요리에 대해 소개하기..
  • 공부 친구(?) (승민)
    • 카테고리로 개발자, 초중등, 고등, 대학생, 취준생, 회사원.. 등등 분류
    • 오늘 공부 인증이나 공부한 거 정리한 사이트? 공유 (사진 필수x)
    • 약간 공부 자극 느낌..
  • 전국 대학교 소통 커뮤니티(인혁)
    • 전국 대학교를 하나의 채널로 타겟
    • 대학생이나 수험생 등 관심을 가지는 모든 사람들에게 정보를 공유
  • OOTD sns (현주) ← 채택
    • OOTD : Outfit Of The Day의 준말로 오늘의 패션을 가리킴
    • 채널은 스트릿, 캐주얼, 빈티지, 등 …? (저도 패션 잘 모릅니다..)
    • 사용자는 ootd를 사진으로 공유할 수 있다. 인스타처럼 사진이 메인?

프로젝트명 : 스타일드 STYLED

Node / NPM


  1. Node : 20.10.0
  1. Npm : 10.2.3

기술 스택(추가 조사 후 확정 볼드 처리 및 표로 정리)

  • 전역 상태 관리 라이브러리(조사 및 보류) zustand & react-query ← 채택 redux(redux-toolkit), recoil, context api, zustand [인혁]: 가벼운 상태 관리로써는 zustand, 빡세게 관리하고 채팅 상태까지 관리하려면 redux 쪽이 낫지 않을까?
ㅤ
현주
승민
익준
인혁
재웅
스택
recoil 또는 zustand
ㅤ
ㅤ
zustand || recoil + react-query
recoil 근데 커피챗 이후 zustand로 바뀜
이유
Recoil은 비교적 useState와 비슷하게 동작. 직관적이면서 간단한 구조를 가짐. 리덕스는 초보자에게는 어렵다고 함(학습에 소요되는 시간이 너무 길어질까봐 걱정). zustand도 가볍게 사용 가능하다고 하니 둘 중에 하나를 선택하고 싶습니다.
ㅤ
ㅤ
서버 데이터 관리는 react - query로 클라이언트 데이터 관리는 프로젝트 기간이 길지 않아 reciol || zustand로 빠르게 개발하는게 괜찮을 것 같습니다.
ㅤ
  1. 라우팅 라이브러리(거의 확정) react-router, history api
  1. 스타일 관련 라이브러리 styled component, emotion(추가 확정 결정)
    1. ㅤ
      현주
      승민
      익준
      인혁
      재웅
      스택
      styled-component
      styled-component
      styled-component
      styled-component
      styled-component
      이유
      ㅤ
      ㅤ
      ㅤ
      ㅤ
      ㅤ
  1. 빌드 도구(확정) vite, webpack
  1. 배포(확정) vercel
  1. 비동기 상태 관리 라이브러리(조사 후 결정) zustand & react-query redux-thunk, react-query + recoil
    1. ㅤ
      현주
      승민
      익준
      인혁
      재웅
      스택
      react-query + recoil or zustand
      ㅤ
      ㅤ
      ㅤ
      react-query
      이유
      recoil + react-query 조합이 자주 쓰인다고 함. api 관련 기능을 관리하기 매우 편리해보인다. 관련 로직 코드를 많이 줄일 수 있음 redux는 서버 데이터 관리가 조금 불편하다고 합니다. https://velog.io/@green9930/react-query-vs.-redux
      ㅤ
      ㅤ
      ㅤ
      Recoil + React-query 조합이 상대적으로 비동기 로직들을 처리하기 편리하고, 간단한 보일러플레이트를 갖는다고 합니다. #reference1 #reference2
       
 
 

ResetCSS와 반응형 단위 사용


  1. 62.5%
  1. 프로젝트 세팅할 때 설정하기
 
 

정리


  1. 테마 오늘 저녁까지
  1. 리액트 과제 코드리뷰 (~22일)
  1. 기능 세부 명세
  1. 팀 규칙