Tech Stack
제품을 완성하는 기술과 경험
아이디어를 실제로 작동하는 서비스로 만들기 위해, 프로젝트의 목적과 운영 환경에 맞는 기술을 선택합니다.
TypeScriptReactNext.jsReact QueryPrisma
Full Stack Focus (Next.js)
Next.js 기반 풀스택 개발
화면과 서버 기능을 하나의 애플리케이션에서 함께 개발합니다. 제품의 요구사항에 따라 렌더링 방식과 데이터 흐름을 설계하고, 운영에 필요한 기능까지 연결합니다.
Next.js 작업 범위
제품 단계와 운영 환경에 맞춰 렌더링·데이터·배포 구조를 조합합니다.
o*****입금내역 관리 웹사이트
Next.jsSEO와 서버 렌더링을 포함한 서비스 구축
App Router페이지·레이아웃·데이터 로딩 구조 설계
Full Stack인증·결제·외부 API를 포함한 웹서비스
Production운영 환경에 맞춘 캐시와 배포 구성
이런 풀스택 서비스를 개발합니다
- Next.js App Router 기반 페이지와 API 개발
- SSR·SSG·ISR을 활용한 SEO 및 성능 최적화
- 회원가입·권한·결제·이메일 등 운영 기능 구현
- 데이터베이스와 외부 서비스 연동을 포함한 풀스택 개발
개발 스택
Next.js App RouterTypeScriptReact Query 또는 Server ActionsPrisma · Drizzle ORMNextAuth · Supabase AuthVercel · Cloudflare
Full Stack Focus (TanStack Start)
TanStack Start 기반 풀스택 개발
TanStack Router와 Query를 중심으로 라우팅, 데이터 로딩, 서버 함수를 타입 안전하게 연결합니다. React 기반의 일관된 구조로 빠르게 검증하고 운영 가능한 서비스로 확장합니다.
TanStack 작업 범위
라우팅과 서버 상태 관리부터 엣지 배포까지 애플리케이션의 전체 흐름을 설계합니다.
TanStack Router타입 안전한 라우팅과 다국어 페이지 구성
TanStack Query서버 상태 캐싱과 데이터 동기화
TanStack StartReact 기반 풀스택 애플리케이션 구조
Cloudflare엣지 환경을 고려한 정적·서버 배포
이런 풀스택 서비스를 개발합니다
- TanStack Router 기반 타입 안전 라우팅과 데이터 로딩
- TanStack Query 기반 서버 상태 캐싱과 낙관적 업데이트
- 서버 함수·API·인증을 포함한 React 풀스택 개발
- Cloudflare Workers·Pages에 맞춘 배포 구조 설계
개발 스택
TanStack StartTanStack RouterTanStack QueryTypeScriptConvex · PostgreSQLCloudflare Workers · Pages
Frontend Focus
React 기반 프론트엔드 Only 개발
아래 기술 스택은 순수 프론트엔드 제작을 위한 구성입니다. 백엔드와 데이터베이스를 포함한 풀스택 개발과 구분해, 빠르고 완성도 높은 웹 화면과 사용자 경험을 구축합니다.
프론트엔드 작업 이력
의뢰자 소속기관은 의뢰인과 사전 협의되지 않은 관계로 익명 처리합니다
h****채팅 플랫폼 고도화
r*****웹기반 자막 편집기
K*****쇼피파이 쇼핑몰의 판매량 집계 자동화
g*****full-page 랜딩페이지 개발
d*****LLM 기반 질의응답 서비스
r*****실시간 운동자세 교정 프로그램
a*****의료이미지 조회 플랫폼
이런 서비스도 개발합니다
- React.js + Supabase 풀스택 개발 (DB 설계 포함)
- 리얼타임 DB 동기화가 필요한 서비스
- 결제 플랫폼 연동 — 구매 및 환불 로직 구현
- WebAssembly가 필요한 웹서비스
- 애니메이션 기반 랜딩 페이지 구축
- 화상채팅 플랫폼 구축
개발 스택
TypeScriptReact QueryZodReact Hook FormTailwind CSSThree.js (웹 3D)Prisma 또는 Drizzle ORM번들러 설정 및 플러그인 추가프로젝트 생성부터 배포·인프라 설정까지
Selected Work
이런 제품을 만들어 왔습니다
웹캠 운동 포즈 교정 피트니스센터 납품앱
여행 예매사이트 MVP
의료이미지 조회 플랫폼 (서울대병원 납품)
웹기반 입출금내역 실시간 알림
의사 구인구직 플랫폼 MVP
LLM 챗봇 (한국공항공사 납품)
스쿠버다이빙 예약 플랫폼
웹기반 자막 자동 생성기
(AI앱) sync.so 카피앱 MVP
What I Build
개발 가능한 서비스
✦신규 페이지와 반응형 레이아웃
✦구글 · 네이버 SEO 최적화
✦OAuth 회원가입과 결제 · 환불
✦중복 신청을 방지하는 예약 서비스
✦이메일 발송과 지도 기반 서비스
✦커스텀 차트와 복잡한 UI 애니메이션
✦다국어(i18n) 웹사이트
✦DB와 동기화되는 실시간 UI
✦맞춤형 PDF 생성과 PWA 앱
✦WebAssembly와 React 연동
Tools I Use
프로젝트에 맞춰 조합하는 스택
프론트엔드
TypeScript
안전한 타입 기반 개발
Next.js
SSG · ISR · SSR 기반 서비스
React Query
서버 상태 캐싱과 동기화
shadcn/ui · Chakra UI
확장 가능한 UI 시스템
데이터 · 상태
React Hook Form + Zod
복잡한 폼과 스키마 검증
Jotai
작고 명확한 전역 상태 관리
Supabase · Convex
빠른 BaaS와 실시간 데이터
Prisma · Drizzle ORM
타입 안전한 데이터베이스 접근
백엔드 · 인증
Next.js · Nest.js
프론트엔드부터 API까지
tRPC
엔드투엔드 타입 안전 API
NextAuth · Supabase Auth
OAuth 회원가입과 세션 관리
결제 · 이메일 · 지도
외부 서비스 연동과 운영 로직
배포 · 품질
Vercel · Cloudflare Pages
서버리스 배포와 CDN 운영
AWS EC2 · GitHub Actions
전통적인 서버와 자동 배포
PWA · Workbox
기기에 설치되는 웹앱
Vitest · ESLint
테스트와 일관된 코드 품질
Delivery
개발부터 배포까지
정적 사이트, ISR, SSR 중 프로젝트의 방향에 맞는 방식을 제안하고 GitHub와 배포 환경을 연결해 작업 단위별로 확인할 수 있게 합니다.