GitHub - nyaknya/-personal-linkbrary: 나만의 링크를 저장해두고 기록하는 사이트

나만의 링크를 저장해두고 기록하는 사이트

API 제공 : 코드잇 (코드잇 스프린트: 프론트엔드 트랙 3기 참여)

참여 과정 중 부가 과제물로 내어졌던 프로젝트인데, 당시에는 시간이 없고 벅차 하지 못했던 게 아쉬워 다시 구현해보게 됐습니다.
👍 포기했었던 과제를 다시 도전하며 나 스스로가 코드를 어떤 식으로 짜는지 파악하는 시간이 되어 좋았습니다.
😑 순차적으로 수업을 배우며 구현해나가는 프로젝트라 앞선 코드를 다시 리팩토링 해야하는 경우가 많았는데,중간중간 라이브러리를 잘 활용하지 못했다는 아쉬움이 들었습니다.
🔥 '나중에 리팩토링하자'라는 마음으로 구현에만 급급했었는데, 리팩토링 이란 한꺼번에 하는 것이 아닌 개발 과정에서 꾸준하게 깔끔한 코드를 작성하도록 노력해야 하는 것임을 깨달았습니다. 다음 프로젝트에선 꼭 더욱 신경 써서 작성할 것입니다.

💻 사용 기술

⌛ 개발 기간

24.08.28 - 24.12.11

세부 개발 기간

 2주차 240828 완료 / 3주차 240829 완료 / 4주차 240901 완료 / 5주차 241020 완료 / 6주차 241025 완료 / 7주차 241102 완료 / 8주차 241104 완료 / 12주차 241104 완료 / 13주차 241203 완료 / 14주차 241206 완료 / 15주차 241207 완료 / 19주차 241210 완료 / 20주차 241211 완료

📁 폴더구조

📦 src
 ┣ 📂components           # 공통 UI 컴포넌트 모음
 ┃ ┣ 📂Common             # 공통적으로 사용하는 컴포넌트 (Button, Header, Footer 등)
 ┃ ┣ 📂Folder             # 폴더 페이지 컴포넌트
 ┃ ┗ 📂Shared             # 폴더 공유 페이지 컴포넌트
 ┣ 📂hooks                # 커스텀 훅 (외부 클릭 감지, 인증 등)
 ┣ 📂pages                # 주요 화면 및 페이지
 ┃ ┣ 📂page               # 페이지명
 ┃ ┣ ┣ 📜index.tsx            
 ┣ 📂store                # 상태 관리 관련 (Zustand 사용)
 ┣ 📂styles               # 전역 및 공통 스타일 파일
 ┃ ┣ 📜globals.scss       # 전역 스타일
 ┃ ┣ 📜_mixins.scss       # SCSS 믹스인
 ┃ ┗ 📜_variables.scss    # SCSS 변수
 ┣ 📂types                # TypeScript 타입 선언
 ┃ ┗ 📜index.d.ts         # 프로젝트 전역 타입 정의
 ┣ 📂utils                # 공통 유틸리티 함수 (API 요청, 시간 처리 등)
 ┗ 📜_app.tsx

👓 Priview

주차별 요구사항

1주차

2주차

3주차

4주차

5주차

[기본] https://bootcamp-api.codeit.kr/docs 에 명세된 "/api/sign-in"으로 { "email": "[email protected]", "password": "sprint101" } POST 요청해서 성공 응답을 받고 "/folder"로 이동하나요?
[기본] 이메일 input에서 "[email protected]"으로 "/api/check-email" 이메일 중복 확인 POST 요청하면 이메일 중복 에러를 확인할 수 있나요?
[기본] 유효한 회원가입 형식의 경우 "/api/sign-up" POST 요청하고 성공 응답을 받으면 "/folder"로 이동하나요?
[심화] 로그인/회원가입시 성공 응답으로 받은 accessToken을 로컬 스토리지에 저장했나요?
[심화] 로그인/회원가입 페이지에 접근시 로컬 스토리지에 accessToken이 있는 경우 "/folder" 페이지로 이동하나요?

6주차

7주차

링크 공유 페이지 url path는 '/shared', 폴더 페이지 url path는 '/folder'가 되도록 설정했나요?
폴더 페이지에서 상단 네비게이션 바는 스크롤 시 상단에 고정하지 않고 가려지도록 했나요?
상단 네비게이션 바에 프로필 영역의 데이터는 https://bootcamp-api.codeit.kr/docs 에 명세된 "/api/users/1"을 활용했나요?
"전체" 폴더를 선택한 경우 "공유", "이름 변경", "삭제" 버튼들이 보이지 않지만, 다른 폴더를 선택한 경우에는 버튼들이 보이나요?
폴더 목록에 필요한 데이터는 "/api/users/1/folders"를 활용했나요?
"전체" 폴더에 필요한 링크들 데이터는 "/api/users/1/links"를 활용하고, 이외의 폴더에 필요한 링크들 데이터는 "/api/users/1/links?folderId={해당 폴더 ID}"를 활용했나요?

8주차

12주차

TypeScript를 활용해 프로젝트에 타입 명시가 필요한 곳을 찾아 타입을 명시했나요?
링크 검색바에 검색어를 입력하면 현재 폴더에 있는 링크들 중 “url”, “title”, “description” 중 하나에 검색어가 포함된 링크들만 필터된 상태로 볼 수 있나요?
링크 검색바에 입력 값이 있는 경우 x 버튼이 보이나요?
링크 검색바에 x 버튼을 누르면 입력값이 없던 UI 상태로 돌아가나요?

13주차

[기본] '/folder' 페이지를 Next.js 프로젝트에 맞게 변경 및 이전 했나요?
[기본] '/shared' 페이지를 Next.js 프로젝트에 맞게 변경 및 이전 했나요?
[기본] 다른 페이지로 이동이 필요한 곳에 next/link의 Link를 적용했나요?
[기본] Input 컴포넌트에 값이 없는 경우 회색의 placeholder값을 볼 수 있나요?
[기본] Input 컴포넌트에 focus in 하면 파랑색 테두리를 볼 수 있나요?
[기본] Input 컴포넌트에 눈 모양 아이콘을 누르면 비밀번호 가리기/보기 기능이 토글 되나요?
[기본] Input 컴포넌트에 값이 에러케이스일 경우 빨강색 테두리와 에러 메세지를 볼 수 있나요?
[기본] Input 컴포넌트에서 focus out 하면 실행할 함수를 설정할 수 있나요?

14주차

15주차

[링크 공유 페이지] 링크 공유 페이지의 url path를 '/shared'에서 '/shared/{folderId}'로 변경했나요?
[링크 공유 페이지] 폴더의 정보는 '/api/folders/{folderId}', 폴더 소유자의 정보는 '/api/users/{userId}'를 활용했나요?
[링크 공유 페이지] 링크 공유 페이지에서 폴더의 링크 데이터는 '/api/users/{userId}/links?folderId={folderId}'를 사용했나요?
[폴더 페이지] 폴더 페이지에서 유저가 access token이 없는 경우 '/signin'페이지로 이동하나요?
[폴더 페이지] 폴더 페이지의 url path가 '/folder'일 경우 폴더 목록에서 "전체" 가 선택되어 있고, '/folder/{folderId}'일 경우 폴더 목록에서 {folderId} 에 해당하는 폴더가 선택되어 있고 폴더에 있는 링크들을 볼 수 있나요?
[폴더 페이지] 폴더 페이지에서 현재 유저의 폴더 목록 데이터를 받아올 때 '/api/folders'를 활용했나요?
[폴더 페이지] 폴더 페이지에서 전체 링크 데이터를 받아올 때 '/api/links', 특정 폴더의 링크를 받아올 때 '/api/links?folderId=1'를 활용했나요?
[상단 네비게이션] 유효한 access token이 있는 경우 '/api/users'로 현재 로그인한 유저 정보를 받아 상단 네비게이션 유저 프로필을 보여주나요?
[심화] 리퀘스트 헤더에 인증 토큰을 첨부할 때 axios interceptors 또는 이와 유사한 기능을 활용 했나요?

19주차

20주차

[기본] 프로젝트 전반에 필요한 리팩토링, 기능 개선을 진행했나요?
[기본] 즐겨찾기 설정된 카드의 별은 파랑색이 되나요?
[기본] 파랑색 별을 다시 클릭하면 즐겨찾기 설정이 해제되고 회색으로 돌아가나요?
[기본] 즐겨찾기 설정/해제는 PUT ‘/links/{linkId}’ 를 활용했나요?

Name		Name	Last commit message	Last commit date
Latest commit History 64 Commits
public/images		public/images
src		src
.eslintrc.json		.eslintrc.json
.gitignore		.gitignore
README.md		README.md
next.config.ts		next.config.ts
package-lock.json		package-lock.json
package.json		package.json
tsconfig.json		tsconfig.json

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Repository files navigation

💻 사용 기술

⌛ 개발 기간

📁 폴더구조

👓 Priview

주차별 요구사항

About

Releases

Packages

Languages

nyaknya/-personal-linkbrary

Folders and files

Latest commit

History

Repository files navigation

💻 사용 기술

⌛ 개발 기간

📁 폴더구조

👓 Priview

주차별 요구사항

About

Resources

Stars

Watchers

Forks

Releases

Packages 0

Languages

Packages