- [useEffect] API로 캐릭터들 불러오기 -> 새로운 빈 DB테이블 생성
- 캐릭터들 드래그로 순서 바꾸기
- [캐릭터] 닉네임/레벨 -> 카던/가토/에포나/출첵 -> 주간
- 닉네임 or 클래스이미지
- [DB] Checker -> 사용자 계정명 -> 원정대 + 캐릭터[]
- (로그인 중) 로그인 페이지 안 보이도록
- (비로그인) 체커 페이지 안 보이도록 or localStorage
- 24-01-12 / Create Firebase SDK & Test DB
- DONE: Initial checking firebase authentication in App
- TEST: ✅ Upload data to Firestore DB
- 24-01-18 / Layout + Authentication
- UPDATE
- Create 'Layout.tsx'
- Google social login
- TEST
- ✅ Upload "checkbox" data to Firestore DB
- ✅ Use LOSTARK API
- TODO
- [CheckBox] 캐릭터마다 객체를 만들어야 함 - 캐릭터 prop 받아오기
- 첫 로그인 시 API를 사용해 캐릭터 리스트 받아오기
- 로컬 폰트 적용법
- 'src' 또는 'public' 폴더에 폰트 파일을 넣기
- 'font-face' 선언 및 import하기
- 'globals.css'에서 선언 후 import하면 편함
- 기본형
@font-face { font-family: "폰트패밀리명"; src: url("경로") format("포맷타입"); font-weight: 값; font-style: 값; } - src폴더는 상대 경로 / public폴더는 절대 경로
- ex.
@font-face { font-family: "NotoSansKR"; src: url("../fonts/NotoSansKR-Black.ttf") format("truetype"); font-weight: 900; font-style: normal; }
- [Tailwind] 'tailwind.config.ts' 파일에서 클래스명 등록하기
- 기본형
const config: Config = { theme: { extend: { fontFamily: { 프로퍼티명: ["폰트명"], }, }, }, } - 사용법 : 클래스명으로
font-프로퍼티명으로 사용
- 기본형
- UPDATE
- 24-01-19 / Character List
- TODO 였던 것
- [CheckBox] 캐릭터마다 객체를 만들어야 함 - 캐릭터 prop 받아오기
- 첫 로그인 시 API를 사용해 캐릭터 리스트 받아오기
- TODO
- Protected page : getServerSideProps()를 이용
- 로그인 후, 첫 체커 시작 시 API를 사용해 캐릭터 리스트 받아오기
- ISSUE : firestore에 배열로 저장하는 방법
- TODO 였던 것
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent