Front-End/Project
-
[WizSched] react-router-dom v6 Outlet 적용Front-End/Project 2024. 1. 11. 02:53
🍀 목차문제Outlet적용하기 문제 지금까지 프로젝트에서 Header가 고정된 레이아웃을 만들 때 app.tsx에서 Header를 선언하여 사용했었다. 이 구조를 다시 보니 라우팅을 관리하는 컨테이너와 UI 컴포넌트가 뒤섞여 있어 읽기 어렵다고 생각했다. 또한 프로젝트에 여러 API를 활용하기에 페이지마다 Header가 달라질 수 있다 판단했다. 그럴때마다 pathname을 이용해 조건문을 작성하여 렌더링 여부를 판단하기는 번거롭다고 느꼈다. 이를 어떻게 개선할 수 있을까 검색해 보다가 react-router-dom(v6)의 Outlet을 알게 되었다. Outlet Outlet은 중첩 라우트 구조에서 자식 라우트를 표시하는 데 사용된다. 부모 라우트의 특정 위치에서 자식 라우트를 렌더링 할 수..
-
[WizSched] 설정 기록Front-End/Project 2023. 12. 15. 02:04
🍀 목차Issues, TemplatesProjectsdefault branch 변경Vite Template을 활용하여 React+TS 세팅ESLint 설정Prettier 설정Tailwind CSS 설치postcss.config.jstailwind.config.jstsconfig.json 프로젝트 요약Google APIs를 활용한 프로젝트 Issues, Templates 개선에 대한 고민만 담은 라벨 추가(예정) Issue 템플릿을 등록하여 이슈 등록 시 편하게 만든다. 개인 프로젝트기에 매번 Assignees는 나이고, Feat 관련 이슈는 Labels를 매번 Feat으로 붙여줘야 할 테니 default로 바꿔주었다. 비슷하게 Bug, Refector, 기타 작업을 위한 템플릿도 만들..