전유영
bitterns96@gmail.com
PollyGotACracker
https://github.com/PollyGotACrackerRepositories:Public 38·Private 13
소개
관심있는 분야에 깊이 파고들기를 좋아하고, 어려운 과제의 해결방법을 고민하는 것을 즐깁니다. 웹 개발 관련 강의를 들으면서 모르는 부분은 파일이나 노트에 작성하고, 참여한 교육이나 공부하고 있는 기술 스택별로 repository를 생성해 정리하고 있습니다. 요즘IT, 커리어리, MDN 등 여러 웹 개발 관련 사이트를 시간이 날 때마다 읽고 있습니다. 현재 새로운 기술을 차근차근 익히며 각 기술만의 매력을 발견하는 중입니다.
학력
- 2025.09 ~ 한국방송통신대학교 컴퓨터과학과 학사
자격증
- 2022.09.02정보처리기사 (한국산업인력공단)
주요 역량
HTML
- Semantic Tag 를 사용한 페이지 구조 설계
dataset속성을 사용하여 CSS, JavaScript 에서 element 조회
CSS
:before,:after가상선택자를 활용한 요소 디자인 구현- Flexbox 와 Grid 를 활용한 복잡한 레이아웃 설계
- Media Query 를 사용한 반응형 레이아웃 구현
- Keyframes 를 사용한 애니메이션 구현
JavaScript
- Event Handler 를 활용한 사용자 인터랙션 구현
- Fetch API 및 FormData 객체를 사용한 데이터 요청
- Web Animation API 를 활용한 애니메이션 구현
TypeScript
type과interface를 사용한 타입 작성- Generic 을 활용한 재사용 가능한 컴포넌트 작성
React
useState,useEffect를 활용한 UI 변경react-dom을 사용한 page routing- Custom hook 을 이용한 로직 재사용
- Code Splitting 및 Lazy Loading 구현
Next.js
- Pages Router, App Router 버전에서의 프로젝트 구현
- 서버 라우터 작성
React-Query
useQuery및useMutation코드 작성- Query
enabled옵션으로 특정 상황에서 데이터 재요청 queryClient.invalidateQueries를 활용한 쿼리 무효화
MSW
- Mocking 환경 구축
- API endpoint mocking 및 handler 작성
params및query를 이용한 동적 응답 처리- 네트워크 에러, 서버 에러 및 지연 상황 테스트
프로젝트
자사 배터리 화재 감지 및 진압 솔루션 3건 / V사 시스템 프론트엔드 2건 외 개발
2024.04 ~ 2025.10- React
- Chart.js
- Rechart
- AntD
- Emotion
- Three.js
- Kakao Map API
- i18Next
- ExcelJS
- React-Grid-Layout
- Websocket API
- MSW
- Axios 및 React-Query(HTTP)
- Canvas API 및 차트 라이브러리를 사용하여 현재 센서값 및 상세 데이터 표시
- 확장성을 고려한 센서 목록 및 센서 정보 모듈화
- Websocket API 를 이용한 사내 데이터 통신 및 모킹 라이브러리 구축
- Three.js 를 이용한 인터랙티브 화면 구현
- 화재 감지 로그 데이터 등 엑셀 파일 다운로드 기능 구현
- 운영 배터리 목록과 화재 알림 설정 관리
- 실시간 배터리 운송 정보 지도 표시
- 사용자 서비스 설정 관리 및 웹 스토리지 저장
- 다국어 지원 구현
키워드 중심 학습 웹 개발 - 개인 프로젝트
2022.12
- React
- React-Query
- Recoil
- Chart.js
- Node.js
- Express
- MySQL
- AWS(EC2, RDS)
- 단어장에 주제와 세부 키워드, 이미지를 포함한 상세 설명
- 단어 검색 기능
- 카테고리, 주제 북마크
- 타이머 설정, 단답식 퀴즈와 점수 표시
- 주제별 / 키워드별 틀린 횟수 표시
- 점수 기록 그래프 표시
- 중요도, 마감일을 포함한 투두리스트
- 사용자 지정 시각 PUSH 알림
- PWA 앱 설치
추천 검색어 구현 - 토이 프로젝트
2023.07
- Typescript
- React
- Axios
- Styled-Components
- Json-Server
- 한국임상정보 사이트의 검색창 UI 및 기능 구현
- custom hook 으로 추천 검색어 데이터 캐싱
- 입력값 유효성 검사 후, 캐싱된 값이 없을 때
setTimeout에서 API 를 호출하여 debouncing 처리 sessionStorage를 사용한 최근 검색어 구현
React Issues - 토이 프로젝트
2023.07
- TypeScript
- React
- Axios
- Styled-Components
- GitHub REST API 를 사용한 React repo Issue 리스트 및 상세 내용 표시
intersectionObserverAPI 를 사용한 infinite Scroll 구현
Todo 리스트 - 토이 프로젝트
2023.06
- React
- Jest
- JWT 를 사용한 회원가입, 로그인 및 로그아웃
- 로그인 여부에 따른 리다이렉션
- todo CRUD 구현
지식공유 커뮤니티 웹 개발 - 팀 프로젝트
2023.01
- React
- Tailwind
- Node.js
- Express
- MySQL
- 게시판, 게시글 및 댓글 기능
- 게시글 검색 및 정렬 기능
- CKEditor 를 사용하여 이미지와 영상 업로드
- 사용되지 않는 이미지는 DB 에서 삭제되도록 스케줄링
공연정보 서비스 웹 개발 - 팀 프로젝트
2022.11
경력
- 2024.05 ~ 2025.10웹 프론트엔드 개발자 | 책임㈜ 비에이에너지
- 자사 배터리 화재 예측 솔루션 개발
- 타사 시스템 외주 개발
교육
- 2026.02 ~ 코드잇 스프린트 프론트엔드 단기 심화 13기㈜ 코드잇
- 2023.06 ~ 2023.08원티드 프리온보딩 프론트엔드 인턴십 11기㈜ 원티드랩
- 프론트엔드 관련 교육 및 기업과제 토이 프로젝트 수행
- 200명 중 6명 우수생 최종 선정
- 2022.10 ~ 2023.04MERN 기반 Full Stack 개발자 양성과정㈜ 한국경영원 인재개발원
- React, Nodejs, Express, MongoDB, MySQL 강의 수강
강의
- 1분 코딩SVG 마스터
- 1분 코딩three.js로 시작하는 3D 인터랙티브 웹
- 조현영Next + React Query로 SNS 서비스 만들기
- 1분 코딩웹 애니메이션의 새로운 표준, Web Animations API
- 김태원자바스크립트 알고리즘 문제풀이 입문(코딩테스트 대비)
- 캡틴판교(장기효)타입스크립트 입문 - 기초부터 실전까지
- 캡틴판교(장기효)실전 프로젝트로 배우는 타입스크립트
- 윤지수모던 자바스크립트(javascript) 개발을 위한 ES6 강좌
- velopert(김민준)누구든지 하는 리액트: 초심자를 위한 react 핵심 강좌
- 정재남코어 자바스크립트
- 정재남Javascript ES6+ 제대로 알아보기 - 보너스
- 정재남Javascript ES6+ 제대로 알아보기 - 중급
- 정재남Javascript ES6+ 제대로 알아보기 - 초급
- 조현영렛츠기릿 자바스크립트
- 조현영웹 게임을 만들며 배우는 React
- 김영한모든 개발자를 위한 HTTP 웹 기본 지식
- 코딩일레븐인터랙티브 개발 실무 끝장내기 [역량 강화편]
- 코딩일레븐몇 줄로 끝내는 인터랙티브 웹 개발 노하우 [초급편]
- Egoing Lee생활코딩 - Redux
- Egoing Lee생활코딩 - 웹브라우저 Javascript
- Egoing Lee생활코딩 - 정규표현식