
미리보기
- 직업
- 프론트엔드 개발
- 이름
- 류대현
- 이메일
- yth4135@naver.com
- 간단소개
- 여행을 좋아하는 웹 프론트엔드 개발자입니다. 주요 활용기술로는 Next.js, TypeScript, SCSS, TanstackQuery 입니다. 스타일링 도구로 Styled-components를 다룰 수 있습니다. 상태관리 도구로 Jotai, Recoil을 활용하며, Jotai를 더 선호합니다. 확장성있는 컴포넌트 구축과 인터랙션 구현에 관심이 있습니다. 프론트엔드 기술 트렌드를 따라가기 위해 노력하고 있습니다.
기술 스택
- 기술 스택
- TypeScript
- Next.js
- react-query
- Sass
- recoiljs
- Ajax
- REST API
- d3.js
- Git
- GitHub
- ESLint
- Figma
- JIRA
- Confluence
- React
경력
- 회사명
- 유니아이
- 직책 • 부서
- 프론트엔드 개발자 • 기술실
- 근무 기간 (근무 형태)
- 2023.09. - 재직 중
- (1년 9개월 | 정규직)
- 담당 업무
스마트팜 양계 종합관리 웹 솔루션 "치킨몽거"의 프론트엔드 전담
자사 홈페이지 개발
Next.js, TypeScript, SCSS, React Query, Git, Github, Recoil, Jotai, React Hook Form, ESLint, Prettier, Figma, Jira, Confluence
- 회사명
- 3SECONDZ
- 직책 • 부서
- 프론트엔드 엔지니어 • R&D Center
- 근무 기간 (근무 형태)
- 2019.11. - 2023.01.
- (3년 3개월 | 정규직)
- 담당 업무
실시간 주행 분석 솔루션 서비스 및 기타 프로젝트의 프론트엔드 개발 및 유지보수
자사에서 제공하는 각종 웹 페이지의 마크업 개발 및 유지보수
HTML, CSS, JavaScript, EJS, SCSS, jQuery, D3.js, Google maps API, AJAX, WebSocket, AWS S3, AWS CloudFront, JSON
- 회사명
- 케이웹미디어
- 직책 • 부서
- 외주 웹퍼블리셔
- 근무 기간 (근무 형태)
- 2018.11. - 2019.03.
- (5개월 | 프리랜서)
- 담당 업무
비상주 인력으로서 신라젠 기업 홈페이지 리뉴얼 웹 퍼블리싱 작업 참여
홈페이지 구성과 인터렉션 부분에 대한 기획 참여
담당 디자인 팀장님과의 활발한 소통을 통한 협업 진행
HTML/CSS, jQuery, PHP, Photoshop
- 회사명
- 아이앤시티
- 직책 • 부서
- 웹 디자이너 & 웹 퍼블리셔 • 인터랙티브디자인부
- 근무 기간 (근무 형태)
- 2018.01. - 2018.10.
- (10개월 | 정규직)
- 담당 업무
중소기업 및 공공기관 프로젝트의 웹 디자인 및 퍼블리싱 작업 담당
팀 내 인원과 활발한 소통을 통한 협업 진행
웹 디자인 작업 참여도 다수 있으나, 대부분은 웹 퍼블리싱 작업 위주로 프로젝트 진행
HTML, CSS, jQuery, PHP(그누보드5), Photoshop, Illustrato
대전 시청 청년정책 사업 “청춘광장” 홈페이지 웹 퍼블리싱 및 디자인 참여 (2018)
한스산업 웹 퍼블리싱 및 디자인 참여 (2018)
레인보우 로보틱스 홈페이지 웹 디자인 및 퍼블리싱 (2018)
레인보우 아스트로 홈페이지 웹 퍼블리싱 (2018)
대전 MICE 웹진 디자인 및 퍼블리싱 (2018)
주요 참여
프로젝트
- 프로젝트명
- ChickenMonger
- 소속/기관명
- 유니아이
- 프로젝트 기간
- 2023.09. - 진행 중
- (1년 9개월)
- 프로젝트 설명
프로젝트 정식오픈을 위한 3차 개선 단계부터 투입
Next.js + TypeScript 기반의 프로젝트 환경 구성
입력 관리를 위해 React-Hook-Form 도입
API 호출 데이터 관리는 React Query, UI 상태관리는 Recoil을 각각 도입하여 적용 (Jotai로 마이그레이션중)
TypeScript, Eslint, Prettier 도입을 통해 일관성 및 안정성 지향
시각화 대시보드 화면에서 Recharts 도입
Next.js, TypeScript, ReactQuery, Jotai, Recoil, React Hook Form, SCSS, ESLint, Prettier, Git, Github, Figma, Jira, Confluence
인공지능 기반 스마트팜 양계 종합관리 웹 솔루션
(아직 정식오픈 전입니다)
- 프로젝트명
- TeamSolution
- 소속/기관명
- 3SECONDZ
- 프로젝트 기간
- 2019.11. - 2022.11.
- (3년 1개월)
- 프로젝트 설명
3SECONDZ 주력 서비스 상품
차량에 장착하는 자사 하드웨어 XYRO를 통해 텔레메트리 데이터를 수신받아 웹 화면에 시각화하여, 각 차량의 실시간 상태를 모니터링하는 솔루션 서비스
개인 회원을 위한 관리 페이지 개선 및 유지보수
모바일 앱 웹뷰 화면의 개선 및 유지보수, 추가 개발 등
HTML, SASS, JavaScript, jQuery, D3.js, EJS, AJAX, WebSocket, Google Maps API, Git, Github, JSON, Zeplin
팀 단위 주행 관제 솔루션
- 프로젝트명
- RaceSolution 및 Superrace Broadcast HUD
- 소속/기관명
- 3SECONDZ, CJ Superrace
- 프로젝트 기간
- 2020.04. - 2022.10.
- (2년 7개월)
- 프로젝트 설명
경기 관제를 위한 솔루션 웹 페이지 개발
방송 화면에서 특정 드라이버 주행 시 오버레이할 HUD 컨트롤 웹 페이지 제작 등
HUD 실제 중계방송화면 https://youtu.be/33_xidx9cH8?si=NyvM74esvtyj0MlY&t=1391
HTML, SASS, JavaScript, jQuery, D3.js, AJAX, WebSocket, Git, Github, JSON, Zeplin, EJS
국내 최대 모터스포츠 경기 SUPERRACE의 경기 관제 솔루션 및 방송용 HUD 제작
- 프로젝트명
- 주행 데이터 분석 솔루션 Lap VS Lap
- 소속/기관명
- 3SECONDZ
- 프로젝트 기간
- 2021.07. - 2022.04.
- (10개월)
- 프로젝트 설명
주행 데이터에 대한 각 텔레메트리 데이터 채널 별로 라인 차트 개발
라인 차트에 대한 패닝 및 줌 인터랙션 기능 개발
트랙 탐색을 위한 패닝 및 줌 인터랙션 기능 개발
주행 데이터의 타임스탬프 등을 활용한 재생 기능 개발
HTML, SASS, jQuery, D3.js, AJAX, JSON, Git, JavaScript, Zeplin, EJS
주행했던 특정 세션에 대해, 다른 주행 데이터와 비교하여 분석할 수 있도록 서비스 제공
- 프로젝트명
- TeamSolution 타이어 모니터링 시각화 데모 개발 for 한국타이어
- 소속/기관명
- 3SECONDZ, 한국타이어
- 프로젝트 기간
- 2020.07. - 2021.11.
- (1년 5개월)
- 프로젝트 설명
타이어 센서로부터 수신받은 데이터를 데이터 값, 게이지 그래픽, 라인 차트 등으로 시각화하여 표현
HTML, SASS, jQuery, JavaScript, D3.js, AJAX, WebSocket, Git, Github, JSON, Zeplin, EJS
한국타이어 R&D용 타이어 센서 모니터링 패널 개발
- 프로젝트명
- 렌터카 관련 신규 프로젝트 데모 시각화 개발 for HL Klemove
- 소속/기관명
- 3SECONDZ, HL Klemove
- 프로젝트 기간
- 2022.11. - 2022.12.
- (2개월)
- 프로젝트 설명
Vitejs 환경으로 개발 시작
대시보드에 사용된 차트는 대부분 Chart.js로 구현
FullCalendar를 활용한 달력 차트 구현
svg 생성 및 인터랙션에 d3.js 활용
웹소켓을 통해 실시간으로 업로드된 데이터를 시각화 처리
mapbox를 활용한 경로 표현
Vite, HTML, SCSS, jQuery, AJAX, Mapbox, JavaScript, JSON, Git, Github, Chart.js, D3.js, WebSocket, Zeplin
렌터카 주행 상태 관리를 위한 대시보드 데모 개발
- 프로젝트명
- 택시 관련 신규 프로젝트 데모 시각화 개발 for HL Klemove
- 소속/기관명
- 3SECONDZ, HL Klemove
- 프로젝트 기간
- 2022.03. - 2022.08.
- (6개월)
- 프로젝트 설명
주행 데이터에 대한 주행 경로 표현, 각 이벤트 지점, 구간 재생 등 타임스탬프 기반 인터랙션 개발
경로 표현, 이벤트 지점 마커, 지역 표현에 google maps API를 활용
지역 표현에 kakao API도 활용
지역별 통계 표현에는 leaflet 활용
대시보드의 라인 차트에 d3.js 활용
HTML, SASS, jQuery, D3.js, AJAX, Google Maps API, JavaScript, Leaflet, JSON, Git, Github, Zeplin
택시 주행 데이터 관리를 위한 데모 개발
- 프로젝트명
- SolutionMaster
- 소속/기관명
- 3SECONDZ
- 프로젝트 기간
- 2021.02. - 2022.12.
- (1년 11개월)
- 프로젝트 설명
기관 및 R&D를 위해, 제한없는 다수의 차량을 종합적으로 관리할 수 있는 서비스 개발
주행 차량 관리를 위한 관리 페이지, 주행 관제 페이지 등 개발 및 유지보수 참여
HTML, SASS, jQuery, JavaScript, AJAX, WebSocket, Git, Github, JSON, Zeplin, EJS
기관 및 R&D를 위한 종합 주행 관제 솔루션 개발
- 프로젝트명
- 유니아이 기업 홈페이지
- 소속/기관명
- 유니아이
- 프로젝트 기간
- 2024.05. - 2024.05.
- (1개월)
- 프로젝트 설명
Next.js SSG 기능으로 빌드 및 배포
기존 WIX 구축 홈페이지에서, 컨텐츠 교체 및 홈페이지 레이아웃 개선 등을 위한 리뉴얼 프로젝트 작업 진행
SPA 영문화 첫 작업
Next.js, TypeScript, Jotai, SCSS, GSAP, ESLint, Prettier, Git, Github, Figma, Confluence
자사 소개 홈페이지의 리뉴얼 프로젝트
https://github.com/uniai-corp/uniai-corp.github.io
- 프로젝트명
- 3SECONDZ 제품 프로모션 페이지
- 소속/기관명
- 3SECONDZ
- 프로젝트 기간
- 2019.12. - 2020.01.
- (2개월)
- 프로젝트 설명
하드웨어 및 웹 솔루션 서비스 관련한 프로모션을 위해 반응형 웹 페이지 3개 페이지 제작
현재는 이전 제작 3개 페이지에서, TeamSolution 페이지만 존재
HTML, SASS, JavaScript, jQuery, EJS, Git, Github, Zeplin
XYRO, TeamSolution, 구매방법 등의 프로모션을 위한 반응형 웹 페이지 3종
https://3secondz.com/service/info_teamsolution
- 프로젝트명
- 3SECONDZ 고객지원 페이지
- 소속/기관명
- 3SECONDZ
- 프로젝트 기간
- 2020.02. - 2020.04.
- (3개월)
- 프로젝트 설명
자사 제품의 사용 설명서 및 Q&A 페이지 제작, AS를 위한 정보 제공 페이지 제작
HTML, SASS, jQuery, EJS, Git, Github, Zeplin, Google Maps API
자사 제품 사용법 및 Q&A, AS 등 정보 제공
- 프로젝트명
- 3SECONDZ 홈페이지 리뉴얼
- 소속/기관명
- 3SECONDZ
- 프로젝트 기간
- 2020.12. - 2021.02.
- (3개월)
- 프로젝트 설명
기존 랜딩페이지에서 멀티페이지 구성으로 변경
서비스 관련 페이지는 플랫폼으로 재구성하여 개발 (https://3secondz.com/service)
HTML, SASS, jQuery, JavaScript, AJAX, WebSocket, Git, Github, JSON, Zeplin, EJS
자사 홈페이지 리뉴얼
- 프로젝트명
- 신라젠 홈페이지 리뉴얼 퍼블리싱
- 소속/기관명
- 케이웹미디어, 신라젠
- 프로젝트 기간
- 2018.11. - 2019.03.
- (5개월)
- 프로젝트 설명
퍼블리싱 외주 인력으로 참여
php 환경으로 반응형 웹 제작
HTML/CSS, jQuery, PHP, Photoshop
신라젠 홈페이지 리뉴얼 홈페이지에 퍼블리싱 외주 참여
- 프로젝트명
- 대전 청춘광장 개발
- 소속/기관명
- 아이앤시티, 대전시청
- 프로젝트 기간
- 2018.02. - 2018.04.
- (3개월)
- 프로젝트 설명
메인 페이지 및 서브페이지 공통 요소에 대한 웹 디자인 참여 (30%)
header, footer 및 gnb 등 공통 요소 제작 및 php로 컴포넌트화 작업
각 페이지 반응형 처리 등 퍼블리싱 전반 참여 (80%)
그누보드 기반으로 적용 작업
HTML/CSS, jQuery, PHP, 그누보드, Photoshop
대전광역시 청년 사업인 "청년공간" 홈페이지 제작
포트폴리오
교육
- 소속/기관
- 공주대학교
- 종류 | 전공명/전공계열
- 대학교(학사) | 대기과학
- 재학 기간 (재학 상태)
- 2009.03. - 2015.02. (졸업)
자격증
- 자격증명
- 정보처리기사
- 점수/급 | 발급 기관
- 정보처리기사 | 한국산업인력공단
- 취득월
- 2019.11
자기소개
- 자기소개
4년 간 jQuery를 메인으로 DOM 이벤트를 구현하는 작업을 해왔습니다.
2019년부터는 3년 간 Node.js/MongoDB 환경에서 EJS, SCSS, jQuery AJAX, WebSocket, JSON, Git/Github,
AWS S3, AWS CloudFront, D3.js, Google maps API 등을 사용한 웹 솔루션 서비스의 프론트엔드 개발을 담당했습니다. 근무 당시, 기획-디자인-백엔드와 직접 소통하거나, Zeplin, XD, Github, Jira, Confluence, Slack 등의 툴을 통해 유기적으로 협업한 경험이 있습니다.
2022년 12월부터는 실무에서 React, React Router, Vite를 활용한 웹 구축을 시작하였고, 2023년 3월 개인 포트폴리오 프로젝트부터 TypeScript, Next.js, Recoil, React Query, Styled-components, Tailwind CSS, GSAP 등을 사용하기 시작하였습니다.
해당 기술을 활용한 코드는 Github을 참고해주세요!