/web-pre-task

웹잼을 준비하는 과비들의 pre-task

Primary LanguageTypeScript

web-pre-task

웹잼을 준비하는 과비들의 pre-task

💡 과비들을 위한 웹잼 전 pretask!

pretask 왜 하나요?

- 주요 기능을 미리 공부해보기 위함입니다. 여러 주요 기능들을 모두 섭렵하며 성장하고 싶은 과비들이 있을 텐데 역할분담을 통해서 자신이 맡은 부분만 구현하다보면 다른 기능들은 어떻게 구현하는지 잘 모르고 넘어갈 수 있어요. 하지만 pretask로 과수원의 기능 전반을 모두 구현해보면서 모든 기능을 구현할 수 있는 실력을 얻어가봅시다. 

- 주요 기능을 구현할 실력이 다져졌다면, 자신감을 얻을 수 있을 뿐만 아니라, 합숙 때 기능을 손쉽게 구현할 수 있기 때문에, 협업과 코드리뷰 등 다른 곳에 리소스를 더 사용할 수 있습니다.

- 주요 기능을 미리 공부한다면, 다른 사람이 짠 코드를 이해하기 훨씬 쉬워질 거에요. 구현을 어떻게 하는지 모르는 상태에서 코드리뷰를 하는 것과, 내가 해보고 아는 상태에서 코드리뷰를 하는 것은 매우 다르겠죠!

- 컨벤션에 금방 익숙해질 수 있습니다! 

기간 : ~7/9 합숙 전
pretask는 의무가 아닌 자율 학습의 영역입니다.
하지만 pretask를 통해 미리 공부 + 코드리뷰를 통해서 
자신감을 안고 합숙에 들어갈 수 있다는 큰 장점이 있겠지요오!

구현 과제

🌈 달력을 구현해보자!

  1. 요일 + 시간 데이터를 가지고 달력에 표기를 해주세요.
    1. ex1. {day:”월”, student:”지수”, time:”13:00~14:00”, isKeep:true, date:""} ex2. {day:”월”, student:”희정”, time:”19:00~20:00”, isKeep:false, date:"2023.11.09"} 입력받으면 표기하기
    2. isKeep이 true면 매주, false면 당일
  2. 학생마다 다른 색깔로 표기해주세요.
  3. 시간순서대로 표기해주세요! → 월요일에는 지수보다 희정이가 뒷타임이니까, 지수를 먼저 표기하고 희정이를 그 다음에 표기.

🔔 알림 기능 직접 구현

  • 섭어랑 얘기해보고 곧 찾아올 예정~
  • TO BE CONTINUE~

아티클 과제

🔔 PWA 알림 구현에 대하여!

세미나 내용 복습 아티클 작성하기!


👤 회원가입/로그인 로직에 대하여!

  • jwt 회원가입/로그인 방식에 대하여

    • 서버와의 토큰을 어떻게 주고받는지

    체리 아티클 ^___^ : 로그인 톺아보기 - 세션, 토큰, 쿠키, JWT

  • 소셜로그인 방식에 대하여

    • 서버, 소셜, 클라와 어떻게 토큰을 주고받는지

  • localStorage, sessionStorage, cookie의 차이는 무엇이고, 언제 무엇을 어떻게 사용하는 것이 좋을까?


🐢 리액트 쿼리에 대하여!

  • 무족권 공식문서 참고하기
yarn add react-query 로 깔게요!
(npm 섞어쓰지 않습니다!!!)
-> @tanstack/react-query보다 그냥 react-query가 더 안정적이라는 이야기가 있어서, 우선은 yarn add react-query 로 해주세용

Installation | TanStack Query Docs

npm: react-query