미리보기

• React.js를 사용해 제작한 웹 포트폴리오

• 다양한 화면에서 접근성과 사용성을 위해 반응형 제작

• 코드 재사용성을 높이고, 코드 중복 처리를 위해 디렉토리를 계층적으로 구성

• useParams 훅을 사용해 세부 페이지를 동적으로 렌더링

• useLocation 훅을 사용해 현재 경로에 따라 동적인 스타일 변경

사용 기술

• React.js, styled-components, JavaScript, TypeScript

  , Netlify

링크

• URL : pjh-portfolio.com

• GitHub : github.com/pjh-portfolio

• Next.js를 이용해 구현한 공지사항 웹사이트

• 데이터 요청, 상태 관리 등 커스텀 훅을 작성해 코드 효율성 향상

• 디렉토리를 계층적으로 구성해 코드 재사용성 증가 및 코드 중복 처리

• Prisma를 활용한 데이터베이스 연결 및 API 엔드포인트 개발

• 데이터베이스 설계, 생성 및 관리

사용 기술

• Next.js, TypeScript, styled-components, Axios,

  Node.js, Prisma

링크

• GitHub : github.com/notification

• 사용자 간 아이콘을 무료로 공유할 수 있는 "ICONDB" 웹 서비스에서 3명의 개발자 중 프론트엔드 개발 담당

• 프로젝트 기획, 설계, 프론트엔드 개발, 배포까지 모든 단계 진행

• 다양한 화면에서 접근성과 사용성을 위해 반응형 제작

• Google API Client Library를 사용해 Google 로그인 개발

• HTML, CSS, JavaScript 환경을 React, styled-components로 리팩토링

• 공통 컴포넌트를 제작해 코드 중복 처리

• 해시태그를 통한 검색 기능을 추가해 사용자 편의성 증가

• 팀원 간 회의록을 작성해 프로젝트 진행 상태를 명확히 파악한 결과, 목표 기간 10% 단축

사용 기술

• React.js, JavaScript, styled-components, Axios,

  Node.js, MySQL

사용 기술

• GitHub : github.com/icondb

• 정기 모임 시 웹 개발 관련 문서 학습

• 방학 기간 동안 팀원과 함께 웹 개발 프로젝트 진행

• 주 1회 알고리즘 관련 문제 해결 후 가장 효율적인 방법 모색

• 학부생들의 다양한 의견을 수집해 학과 운영에 반영

• 학생들과의 원활한 소통을 위해 SNS를 활용하고, 발생하는 문제에 신속하게 대응