미리보기

[헬로비즈 웹사이트]

• 회사 랜딩 페이지 디자인 리뉴얼을 진행하였습니다.

[Cube 프로젝트]
인테리어 견적 플랫폼 Cube 프로젝트의 웹 프론트엔드 담당

• 고객사와 주기적인 미팅을 통한 Cube/Cube Admin 개발 업무를 진행하였습니다.
• 직렬적으로 요청하는 api 요청을 병렬화하여 유저의 대기 시간을 단축하였습니다.
• 반응형 디자인을 적용하였습니다.

[콩오더 프로젝트]
커피 주문 플랫폼 콩오더 프로젝트의 웹 프론트엔드 담당

• 카페회원 PMS와 Admin 페이지의 디자인 시스템을 구축하였습니다.
• 각 디바이스 별 최적화된 화면을 제공하기 위하여 반응형 디자인을 적용하였습니다.

버스 노선 개설을 희망하는 사용자간 매칭을 통한 맞춤형 모빌리티 스타트업

[모두의셔틀 비즈니스]

• Hackle을 통해 유저의 진입률과 이탈률을 확인했고, A/B테스트를 진행하여 UI개선 결과 최초 진입유저의 Form 페이지로의 진입률을 10% -> 30%로 개선하였습니다.
• 비즈니스 페이지의 랜딩 페이지의 퍼블리싱 및 랜딩 페이지를 개발하였습니다.
  사용자 데이터를 기반으로 UI개선 진행하기 위해 위하여Intersection Observer를 통해 이탈 전 유저가 어떤 내용까지 확인했는지 파악할 수 있는 컴포넌트를 개발하였습니다.
• webWorker를 사용하여 문자 전송 후 타이머가 지연되는 문제를 해결했습니다.

[모두의셔틀 Admin]

• 운영팀과의 협업통해 기존 Admin의 개선할 점을 도출하여 기능 및 편의성을 개선하였습니다.
• T-map api와 Kakao-map을 연동하여, 셔틀버스 운행 경로를 설정, 수정 기능을 추가하고 경로를 시각화하여 운영팀의 상담 업무의 효율을 높일 수 있었습니다.
• kakao-map에서 활용되는 마커의 컴포넌트화 및 문서화 작업을 통해, 동료들이 kakao-map을 사용할 때 발생하는 러닝커브를 최소화 하였습니다.

모임을 하다보면 꼭 하나씩은 생기는 벌금 제도,
팀원이 많아질수록 벌금을 관리하는 것에 시간을 많이 쏟게 됩니다.
예전부터 동일한 불편함을 겪고 있는 총무의 불편함을 개선하기 위한 벌금 관리 서비스입니다.

[사용한 기술 스택]
Typescript, React, React Query, Recoil, webpack, S3, CloudFront, github actions, msw, storybook

[담당한 부분]

• 초기 멤버로 참여하여 기획, 디자인, 프론트엔드 개발 참여
• 프론트엔드 배포 프로세스 구축
• 프론트엔드 개발 및 코드 리뷰
  • Modal 컴포넌트 추상화
• Storybook 작성하여 컴포넌트 문서화
• GA4, GTM 연동

[URL]

• 서비스: https://sosim-manager.com
• 서비스 소개: https://www.notion.so/25348117c25b4403842ed533f388179c?pvs=4
• 서비스 기능: https://github.com/so-sim
• github: https://github.com/so-sim/front

현재 위치 기반으로 주변의 실시간 접근 지하철을 확인할 수 있는 어플입니다.현재 구글 플레이 콘솔 비공개 테스트 중입니다.

[사용한 기술 스택]
Typescript, React Native, Recoil, React-Query, Async Storage

[담당한 부분]

• 1인 개발
• 현재 위치 기반 주변 역 탐색 기능
• 실시간 지하철 추가 기능
• 지하철 노선 생성 기능
• 지하철 역 검색 기능
• 지하철 즐겨찾기 기능

[URL]

• github: https://github.com/Jong1co/subway-realtime

잡코리아에서 2020년 724명의 구직자를 대상으로 <취업불안감>조사를 한 결과 약 92%가 취업 불안감을 느낀다고 답변했습니다. 랭플은 미래에 대한 막연함과 ‘내가 과연 잘 하고 있는 걸까?’ 에 대한 불안감을 해소시키기 위한 시간 관리 플랫폼입니다.

[사용한 기술 스택]
Javascript, React, Redux-Toolkit, Style-components, PWA, S3, CloudFront, github actions

[담당한 부분]

• 팀 리더
• 프론트엔드 개발 참여
• 타임 타이머 및 스톱워치 로직 / 반응형 Layout / PWA를 이용한 웹앱 / FCM을 통한 웹 푸시 구현
• 유저 피드백을 통한 서비스 개선
•  Date Library 선정

[URL]

• github: https://github.com/Jong1co/rankple

Figma를 이용해 디자인부터 개발까지 진행한 프로젝트입니다.

[사용한 기술 스택]
Typescript, NextJS, Tailwind, Nodemailer, Figma

• Figma를 이용한 디자인 작업
• Markdown을 이용한 게시글 작성
• Utteranc를 이용한 댓글 기능 추가
• Nodemailer를 이용한 이메일 연동

[URL]

• 서비스: https://my-blog-jong1co.vercel.app
• github: https://github.com/Jong1co/my-blog

환경변수를 자동완성으로 사용할 수 있는 vscode익스텐션입니다.
환경변수를 Import하는 과정에서 자동완성이 되지 않는 불편함과,
이를 통해 발생하는 휴먼에러를 개선하기 위해 개발을 진행했고, 마켓 플레이스에 배포하였습니다.
-환경변수 자동 완성/미리보기 기능

[URL]

• 마켓 플레이스: https://zrr.kr/tGdg
• github: https://github.com/Jong1co/env-completion