Skip to content
/ Dialga Public
forked from PoolC/Haribo

'PoolC 홈페이지 리뉴얼'의 리뉴얼 2023 - Frontend🚀

Notifications You must be signed in to change notification settings

PoolC/Dialga

 
 

Repository files navigation

poolc-dialga

Dialga

  • PoolC Renewal 2023 Web Frontend(forked from Haribo)
  • Backend Repository: Palkia

stacks

  • yarn berry monorepo
  • react
  • react-dom
  • vite
  • typescript
  • antd
  • emotion
  • tanstack-query
  • redux
  • ...

setting

run

  • Node.js ^20
  • yarn ^3.7.0
yarn # install packages
yarn web-client codegen # generate types
yarn web-client dev # load dev server

vscode setting

  1. install ZipFS extension
  2. run yarn dlx @yarnpkg/sdks vscode in terminal
  3. View > Command Palette > Typescript: Select Typescript version > Use Workspace Version

https://kimyanglogging.tistory.com/8

수정사항

  • node 버전 20.x로 업그레이드
  • react 버전 18.x로 업그레이드
    • react 18 업그레이드 해야 antd 관련 불필요한 warning 방지 가능함. 관련 이슈
  • 신규 기능들 typescript 5.x로 제작
  • 디자인 시안 부재 + 톤앤매너 맞추기 위해 antd 사용. 당장의 생산성 + 향후 다크모드 도입시의 빠른 기능 추가 위해 antd-style 이용해 커스텀
  • styled-components를 emotion으로 마이그레이션
    • antd와의 호환성, 더 적은 용량
  • cdn 이용한 font awesome 의존성 제거하고 antd icons를 사용
  • meta tag 추가
  • cra환경을 vite로 마이그레이션
  • api 중복 호출 및 정합성 깨지는 문제를 tanstack-query로 해결. 백엔드 api와의 정합성 유지 위해 openapi-typescript-generator 사용
  • 수정사항에 맞게 배포환경 dockerizing
  • toast-ui editor를 v2에서 v3로 업그레이드

신규 기능들

  • 게시판
  • 마이페이지
  • 뱃지관리기능
  • 동아리방예약
  • 백준 익스텐션 제작해서 사이트와 연동
  • 기타 ui 틀어지는 곳들 수정

TODOS

  • react-router-dom v6 업그레이드(or tanstack router?)
  • suspense 도입 및 레기서 api호출들 tanstack-query로 모두 전환
  • vite-ssr 도입 -> 세미나 메타태그 생성
  • redux 제거. 정 상태관리 필요한 곳은 가벼운 다른 라이브러리로 대체
  • 레거시 페이지들 마이그레이션

About

'PoolC 홈페이지 리뉴얼'의 리뉴얼 2023 - Frontend🚀

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • JavaScript 65.7%
  • TypeScript 33.0%
  • HTML 1.3%