| 기술 분류 | 기술 스택 | 설명 & 경험 | 숙련도 (자기평가) |
|---|---|---|---|
| Markup & Style |    |
웹 표준/접근성을 준수한 시맨틱 마크업 및 Flexbox/Grid 기반 반응형 레이아웃 구현 능숙. Sass 활용한 유지보수성 높은 스타일링 아키텍처 설계 가능. | ★★★★☆ |
| Frontend Core |  |
순수 JS 기반 동적 DOM 제어, 라이브러리 없는 SPA 로직 구현 경험. fetch/async/await 활용 비동기 통신 및 ES6+ 문법 활용 능숙. |
★★★☆☆ |
 |
jQuery를 이용한 레거시 코드 분석 및 다양한 동적 UI/이벤트 구현 가능. | ★★☆☆☆ | |
| Data & API |  |
대용량 데이터의 JSON 구조 최적화 및 파싱 처리, 비동기 데이터 바인딩 경험. | ★★★☆☆ |
| BaaS |  |
Serverless 환경에서의 DB 설계, 실시간 CRUD 연동 및 스토리지 관리 경험. | ★★☆☆☆ |
| Framework |  |
컴포넌트 기반 UI 구축 및 Hooks(useState/useEffect) 활용 상태 관리, Axios 기반 API 연동 경험 (ERP 프로젝트). |
★★☆☆☆ |
| Backend |   |
Java/Spring Boot 기반 REST API 흐름 이해. 백엔드 개발자와의 원활한 협업을 위한 기본 아키텍처(MVC, Repository) 지식 보유. |
★★☆☆☆ |
| Database |   |
기본적인 CRUD 쿼리 작성 및 DB 테이블 설계 흐름 이해. | ★★★☆☆ |
| Version Control |   |
Git Flow 이해, SourceTree 및 CLI를 활용한 브랜치 전략/협업(Merge/PR) 경험. | ★★★☆☆ |
| Tools |    |
Figma 디자인 시안의 정교한 퍼블리싱 구현, Postman API 테스트, Photoshop 기본 이미지 편집 가능. |
★★★★☆ |
"코드만으로는 보여드릴 수 없는, 실제 구동되는 서비스와 기술 상세를 웹으로 정리했습니다."
아래 버튼을 클릭하시면 포트폴리오 사이트로 이동합니다.
-
소개: React 기반 맥주 제조 공정(생산계획~출하) 관리 ERP 개발. LOT 기반 10단계 공정 데이터 연동 및 상태 시각화 구현.
-
기술: React, JavaScript, HTML5, CSS3, React Router, axios, REST API (백엔드: Java, Spring Boot, JPA, ORACLE).
-
LINK:
-
소개: 단순한 랜덤 추출이 아닌, 데이터 기반의 논리적 근거를 가진 번호 생성 서비스입니다. 사용자 친화적인 UI/UX와 PWA를 도입하여 앱 수준의 사용성을 제공합니다.
-
기술: JavaScript (ES6+), HTML5, CSS3, Google Search Console, PWA.
-
LINKS:
-
소개: 순수 JavaScript(SPA)와 JSON 기반 반응형 웹사이트.
144개 이미지,GIF파일을 AVIF 변환 및 WEBM 변환 , Intersection Observer API 최적화로 Lighthouse 97점 달성
및 애니매이션 라이브러리 최소화 사용 및 직접 CSS 효과사용 하여 구현 하였습니다. -
기술: HTML5, CSS3 (Grid, Media Queries, Animation), 순수 JavaScript (ES6+), JSON, Swiper.js, Lighthouse.
-
LINKS:
-
소개: 웹 표준/접근성 기반 퍼블리싱 위에 BaaS(Supabase) 실시간 CRUD, 다중 JSON 처리(AJAX) 등 프론트엔드 기술을 주도적으로 적용.
-
기술: HTML5, CSS3, JavaScript (ES6+), jQuery, AJAX, JSON, BaaS (Supabase).
-
LINKS:
-
소개: Flexbox/Grid 기반 모바일 최적화 레이아웃. BaaS 연동 등 PC 버전 동적 기능을 모바일 환경에 적용하고 Swiper.js로 터치 UX 강화.
-
기술: HTML5, CSS3 (Flexbox/Grid), JavaScript (ES6+), jQuery, AJAX, JSON, BaaS (Supabase), Swiper.js.
-
LINKS:
(PC에서는 F12 → 모바일 화면으로 보시길 권장합니다)
-
소개: 보험사 업무 효율화를 위한 그룹웨어. DB/계약 관리 파트 담당하여 고객/계약/상품 CRUD, 실시간 실적 대시보드, 만기 고객 필터링 등 구현.
-
기술: HTML5, CSS3, JavaScript, Bootstrap, Chart.js, AJAX, JSON, REST API (백엔드: Java, Spring Boot, MyBatis, MySQL).
-
LINK: