{"id":23376276,"url":"https://github.com/chay140/pokemon-dex","last_synced_at":"2026-04-14T00:04:55.106Z","repository":{"id":261517873,"uuid":"884077667","full_name":"chay140/pokemon-dex","owner":"chay140","description":"간단한 포켓몬 사전 SPA 프로젝트","archived":false,"fork":false,"pushed_at":"2024-11-14T02:34:11.000Z","size":389,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-02-14T02:52:53.409Z","etag":null,"topics":["react","react-router-dom","rtk","vite"],"latest_commit_sha":null,"homepage":"https://pokemon-dex-one.vercel.app","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/chay140.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2024-11-06T05:10:44.000Z","updated_at":"2024-12-05T11:50:47.000Z","dependencies_parsed_at":"2024-11-07T01:23:15.015Z","dependency_job_id":"5a9b5e35-66dd-4d62-8ef6-8fc67a64251a","html_url":"https://github.com/chay140/pokemon-dex","commit_stats":null,"previous_names":["chay140/pokemon-dex"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chay140%2Fpokemon-dex","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chay140%2Fpokemon-dex/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chay140%2Fpokemon-dex/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chay140%2Fpokemon-dex/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/chay140","download_url":"https://codeload.github.com/chay140/pokemon-dex/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247773745,"owners_count":20993633,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["react","react-router-dom","rtk","vite"],"created_at":"2024-12-21T17:36:20.091Z","updated_at":"2026-04-14T00:04:55.072Z","avatar_url":"https://github.com/chay140.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003cimg src=\"https://capsule-render.vercel.app/api?type=waving\u0026color=BDBDC8\u0026height=150\u0026section=header\" /\u003e\n\n# pokemon-dex\n\u003e React-Vite 사용한 React projecct\n\u003e Vercel을 이용한 배포 링크 : https://pokemon-dex-chay-parks-projects.vercel.app/\n\n## 페이지 소개\n포켓몬 1세대 사전도감 페이지를 SPA 형식으로 구현했습니다.\n트레이너가 6마리의 포켓몬을 리스트 혹은 포켓몬 상세 페이지에서 사용할 수 있게끔 기능을 구현하였습니다.\n![image](https://github.com/user-attachments/assets/d60472ff-8ca4-4c84-8e8f-2102a0598d6c)\n\n## 페이지 구성\n* Home : 시작시 홈페이지\n* Dex : 포켓몬 선택을 보여주는 대시보드와 포켓몬 리스트가 보이는 포켓몬리스트로 구성\n* PokemonDetails : 포켓몬 카드를 눌었을때 보여주는 상세 페이지\n\n## 프로젝트 구성도\n```\nApp\n│\n└── Router\n     ├── Home\n     ├── Dex\n     │    ├── Dashboard\n     │    └── PokemonList\n     │         └── PokemonCard\n     └── PokemonDetail\n```\n\n### 구성 요소 설명\n\n1. **App**  \n   - 전체 애플리케이션의 루트 컴포넌트로, `Router` 컴포넌트를 포함하여 애플리케이션의 페이지 간 이동을 관리합니다.\n2. **Router**  \n   - `App`의 하위 컴포넌트로, `Home`, `Dex`, `PokemonDetail` 경로를 포함한 여러 페이지를 라우팅합니다.\n3. **Home**  \n   - 라우팅되는 첫 번째 페이지로, 별도의 하위 컴포넌트는 없습니다.\n4. **Dex**  \n   - `Dashboard`와 `PokemonList`를 포함하여 포켓몬 목록과 관련된 정보를 보여주는 페이지입니다.\n5. **Dashboard**  \n   - `Dex`의 하위 컴포넌트로, 포켓몬의 전반적인 통계를 시각적으로 나타냅니다.\n6. **PokemonList**  \n   - `Dex`의 하위 컴포넌트로, 여러 포켓몬 카드를 나열하며, `PokemonCard` 컴포넌트를 사용하여 개별 포켓몬 정보를 카드 형식으로 표시합니다.\n7. **PokemonCard**  \n   - `PokemonList`에서 사용하는 개별 포켓몬 카드 컴포넌트로, 포켓몬의 이미지와 이름 등 주요 정보를 보여줍니다.\n8. **PokemonDetail**  \n   - 선택된 포켓몬에 대한 세부 정보를 표시하는 컴포넌트로, `Router`에서 직접 라우팅됩니다.\n\n# 사용 라이브러리\n![react](https://img.shields.io/badge/React-20232A?style=for-the-badge\u0026logo=react\u0026logoColor=61DAFB)\n\n# 기술 스택\n![js](https://img.shields.io/badge/JavaScript-F7DF1E?style=for-the-badge\u0026logo=JavaScript\u0026logoColor=black)\n![html](https://img.shields.io/badge/HTML5-E34F26?style=for-the-badge\u0026logo=html5\u0026logoColor=white)\n![css](https://img.shields.io/badge/CSS3-1572B6?style=for-the-badge\u0026logo=css3\u0026logoColor=white)\n\n### Readme 작성\n![markdown](https://img.shields.io/badge/Markdown-000000?style=for-the-badge\u0026logo=markdown\u0026logoColor=white)\n\n\u003cimg src=\"https://capsule-render.vercel.app/api?type=waving\u0026color=BDBDC8\u0026height=150\u0026section=footer\" /\u003e\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fchay140%2Fpokemon-dex","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fchay140%2Fpokemon-dex","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fchay140%2Fpokemon-dex/lists"}