안녕하세요! 👋

데이터를 서비스로 연결하는 웹 개발자

React, Spring Boot, JSP를 활용해 사용자 중심의 웹 서비스를 만들고, Oracle·PostgreSQL 데이터베이스와 외부 API 연동, 데이터 파이프라인, CI/CD 배포까지 경험했습니다.

5+프로젝트
4+배포 경험
API연동 다수
CI/CD구축 경험
React
Spring
JSP
Oracle
PostgreSQL
Actions
📁 5개 프로젝트
☁️ GitHub Pages · Vercel · Render · Cloudflare Pages
🔗 KAMIS · OpenDART · Opinet · Gemini API
GitHub Actions 자동화

PROJECT COLLECTION

프로젝트

모든 프로젝트 보기 →
팜프라이스 노트 미리보기

팜프라이스 노트

농산물 가격 정보를 한눈에 확인하는 데이터 서비스입니다.

ReactViteKAMIS API
GitHub Actions · GitHub Pages
상장노트 미리보기

상장노트

기업 공시와 상장 일정을 쉽게 확인하는 서비스입니다.

ReactViteOpenDART API
ZIP 처리 · 인코딩 변환 · 자동 갱신
리터세이브 미리보기

리터세이브

전국 주유소 가격을 비교해 절약을 돕는 서비스입니다.

ReactViteOpinet API
Static JSON · 좌표 변환 · GitHub Pages
Review Tag 미리보기

Review Tag

리뷰를 태그로 정리하고 검색하는 콘텐츠 플랫폼입니다.

ReactSpring BootOracle
JWT · Vercel · REST API
PETIQUE 미리보기

PETIQUE

반려동물 분양과 후기를 연결하는 웹 서비스입니다.

JSPSpring MVCOracle
Render · JdbcTemplate · Spring Mail

CI/CD · DEPLOYMENT

CI/CD · 배포 경험

GitHub Actions워크플로우 자동화로 데이터 수집, 빌드, 배포 흐름 구성
GitHub PagesReact/Vite 정적 프로젝트 배포
Vercel프론트엔드 프로젝트 배포 및 미리보기 환경
RenderSpring Boot 백엔드 서비스 배포 및 환경 변수 관리
Cloudflare Pages전역 CDN 기반 정적 포트폴리오 배포 준비

DATA PIPELINE

데이터 파이프라인 처리 경험

1외부 API 수집
2데이터 가공
3JSON 생성
4화면 반영
5자동 배포

KAMIS, OpenDART, Opinet 데이터를 브라우저에서 직접 호출하지 않고 Node.js 스크립트와 GitHub Actions로 먼저 수집했습니다. 이후 정렬, 필터링, 인코딩, 좌표 변환을 거쳐 정적 JSON으로 만들고 React 화면에서 조회하도록 구성했습니다.

PROJECT DETAIL

프로젝트별 구현 포인트

팜프라이스 노트

KAMIS 가격 데이터 수집, 전일 대비 계산, 기간별 통계, Gemini 요약 리포트 생성 흐름을 구성했습니다.

KAMIS → Normalize → Gemini Report → JSON

상장노트

OpenDART 데이터의 ZIP 추출과 한글 인코딩 변환을 처리하고 검색 가능한 일정 데이터로 정리했습니다.

OpenDART → ZIP Extract → Encoding Convert → JSON

리터세이브

Opinet 가격 데이터를 유종·지역 기준으로 정렬하고 지도 이동에 필요한 좌표 정보를 함께 가공했습니다.

Opinet → Price Sort → Coordinate Transform → JSON

Review Tag

포인트, 출석, 퀘스트, 룰렛, 상점, 인벤토리, 관리자 포인트 기능을 React와 Spring Boot로 연결했습니다.

React SPA ↔ REST API ↔ Oracle

PETIQUE

분양 리스트/상세, 신청자 관리, 승인·거절·완료 상태 처리와 후기 연결 흐름을 구현했습니다.

JSP ↔ Spring MVC ↔ Oracle

문제 해결

API Key 노출, 공시 데이터 인코딩, 사용자 역할별 버튼 노출처럼 구현 과정에서 나온 이슈를 분리해 처리했습니다.

Secrets · Validation · Role/Status Logic

TECH STACK

기술 스택

Frontend

ReactViteJavaScriptHTML5CSS3AxiosJotaiBootstrap

Backend & View

Java 21Spring BootSpring MVCSpring SecurityJWTJSPJSTLREST API

Database

OraclePostgreSQLSQLCRUDSchema DesignTransaction

Data & API

KAMIS APIOpenDART APIOpinet APIGemini APITMDB APIJSONXMLNode.js Script

CI/CD

GitHub ActionsGitHub PagesVercelRenderCloudflare PagesGitHub Secrets

CONTACT

실제로 동작하는 서비스를 만들고 개선하는 개발자

화면, 서버, 데이터, 배포 흐름을 함께 이해하며 프로젝트를 완성해가고 있습니다. 이 포트폴리오는 Cloudflare Pages 배포를 기준으로 구성했습니다.