software

React와 Spring Boot를 사용한 풀스택 Pokédex 검색 엔진 구축

발행: (2025년 12월 14일 오전 03:48 GMT+9)
2 min read
원문: Dev.to

Source: Dev.to

Introduction

최근 API 통합 및 풀스택 개발 연습을 위해 전체 스택 포켓덱스 검색 엔진을 개발했습니다. 이 프로젝트는 사용자가 포켓몬을 이름으로 검색하고, 깔끔하고 반응형 UI에서 스탯, 능력치, 이미지를 확인할 수 있게 합니다.

Frontend

  • React – 동적이고 컴포넌트 기반의 사용자 인터페이스를 제공합니다.

Backend

  • Spring Boot (Java) – 외부 포켓몬 API에서 데이터를 가져와 프론트엔드에 전달하는 API 레이어 역할을 합니다.

API

  • PokéAPI – 애플리케이션 전반에 사용되는 실시간 포켓몬 데이터를 제공합니다.

Features

  • 이름으로 포켓몬 검색
  • 스탯, 타입, 능력치 및 이미지 보기
  • 부드러운 사용자 경험을 위한 반응형 UI

참고: 백엔드가 초기 로드 시 API 호출 때문에 몇 초 정도 걸릴 수 있지만, 이후 검색은 빠르게 진행됩니다.

Challenges Addressed

  • API 데이터를 효과적으로 처리하고 구조화하기
  • 백엔드 응답 시간 관리
  • 프론트엔드와 백엔드를 원활한 풀스택 애플리케이션으로 통합하기
  • 기능적인 웹 애플리케이션 배포하기

Deployment & Live Demo

이 프로젝트가 유용하다고 생각되시면 GitHub 저장소에 ⭐를 눌러 주세요. UI/UX, 코드 구조, 성능 개선에 대한 피드백도 환영합니다.

Back to Blog

관련 글

더 보기 »