FE 프로젝트
[개인 미니 프로젝트] PokeAPI로 포켓몬 도감 만들기 (1) 프로젝트 준비
바닷가쟤
2023. 9. 6. 00:39
저번주부터 JS 개념을 다지고 싶어서 API를 활용해서 나만의 프로젝트를 만들어 보고 싶다는 생각을 했었다.
API 사용을 하는거만 보고 따라만 했지 어떻게 사용하는건지를 몰라서 해봤었는데 너무 어렵고 복잡하고 생각처럼 되지 않아서 칼삭해버렸다....ㅜㅜ
그래서 걱정이 많았는데 그룹 스터디에서 시간도 난 김에 API를 사용한 개인 프로젝트를 하자고 제안해주셔서 아주 좋다(강제성이 생겼다)
Documentation - PokéAPI
If you were using v1 of this API, please switch to v2 (this page). Read more… Quick tip: Use your browser's "find on page" feature to search for specific resource types (Ctrl+F or Cmd+F). Information This is a consumption-only API — only the HTTP GET m
pokeapi.co
포켓몬 API에 꽂혀서 이걸 만들어 보기로 했다.
사실 구상할 때는 좀 크게크게 했었는데 지금 하는 꼬라지 봐서는... 일단 포켓몬 도감 하나라도 끝내는게 .. 일단 목표이다.
프로젝트 주제
Poke API로 포켓몬 도감 만들기 !
프로젝트 기간
2023.09.05(화) ~ 2023.09.07(목) 3일
금요일 오전에 그룹 스터디원들과 공유
목표
- API 사용법 익히기
- JS 작성에 익숙해지기(일단 내가 구현해보고 나서 챗지피티 쓰기..)
- 챗지피티를 쓴다면 코드를 다 읽고 이해하고 넘어가기
- 최대한 컴포넌트별로 나눠서 코드 작성해보기
- 페이지 라우팅 기능 넣기
구현하고 싶은 기능
- 도감 메인 페이지 : 포켓몬 이름, gif, 포켓몬 타입으로 이뤄진 카드 출력
- 포켓몬 클릭 시 상세정보 : 포켓몬 이름, 타입, 종, 설명, 그림, 키/몸무게 등
- 찜하기 기능 (storage 기능)
- 타입별 포켓몬 모음
- 라이트모드/다크모드 기능
- 반응형으로 구현하기
일단 최소한 메인 페이지와 클릭 시 상세정보는 꼭 구현해야한다.
728x90