Web PublisherPORTFOLIO

SKILL

• Js

  ES6+ 문법을 활용한 효율적인 로직 구현(화살표함수, 구조분해, 리터럴등)

  DOM 조작 및 비동기 통신(Fetch, Axios)을 통한 동적 데이터 바인딩

• React/Next

  SSR/SSG 환경의 특징을 이해하여 웹에 최적화 적용

  컴포넌트 기반 설계를 통한 UI 재사용성 및 유지보수 용이하게 작업

  프레임워크 환경에 최적화된 공통 UI 컴포넌트 마크업 수행

• TypeScript

  정의된 타입을 바탕으로 런타임 에러를 고려한 안정적인 마크업 설계

  인터페이스를 활용한 명확한 데이터 구조 이해

• Vue

  Vue 컴포넌트 라이프사이클에 대한 기본 이해 및 구조 분석

  데이터 바인딩과 디렉티브를 활용한 동적 UI 구현 경험

• Jquery

  오픈 소스 플러그인 활용 및 기존 레거시 코드 유지보수 가능

  크로스 브라우징 이슈 해결 및 빠른 DOM 제어

• Git

  버전 관리를 통한 안전한 코드 협업 환경 구축

  원활한 코드 리뷰 및 협업

• HTML

  웹 표준 및 시맨틱 마크업을 준수하여 구조적인 웹 페이지 설계

  웹 접근성을 고려한 마크업 및 WAI-ARIA 활용 가능

  SEO(검색 엔진 최적화)를 고려한 시맨틱 태그 구조 설계

• SASS/CSS

  SCSS 전처리기를 활용한 변수, Mixin, 함수 등 공통 가이드화 작업

  유지보수가 용이한 CSS 방법론(BEM 등) 적용 가능

  미디어 쿼리, 키프레임을 활용한 동적인 반응형 레이아웃 구현

• Tailwind CSS

  미리 정해진 클래스를 사용하여 빠른 UI 제작

  불필요한 CSS 코드 최소화 및 디자인 시스템의 효율적 적용

• CSS Modules

  클래스 네임 충돌 방지 및 컴포넌트 단위의 독립적 스타일링

  유지보수가 편리한 모듈화된 CSS 환경 구축

• Gsap

  ScrollTrigger를 활용한 고도화된 인터랙티브 웹 페이지 제작

  Timeline 기반의 정교한 애니메이션 시퀀스 제어

• Vite

  Vite를 활용한 최신 개발 환경 구현 경험

• Figma

  디자인 시스템 가이드를 분석하여 정확한 수치로 구현

  피그마 툴을 활용한 직접적인 수정 및 협업 가능

• Zeplin

  디자인 가이드를 확인하여 수치 기반의 정확한 마크업 구현

• Slack

  팀원 간 실시간 업무 공유 및 원활한 커뮤니케이션

• Notion

  프로젝트 일정 관리 및 문서화를 통한 원활한 커뮤니케이션

  업무 히스토리 기록

• Photoshop

  디자인 시안 분석 및 웹용 이미지 최적화 저장

  레이어 마스크 및 보정 기능을 활용한 소스 편집

• Illustrator

  SVG 벡터 소스 추출 및 패스 수정을 통한 수정 작업