기업 과제 소개
원티드 pre-onboarding, Winning I의 기업 협업 과제입니다. Winning I는 “비접촉 생체인증 솔루션”을 핵심사업으로 지문인식, 장문(손바닥)인식, 얼굴인식을 모바일용 복합인증 솔루션으로 제공하여 차별화된 다양한 B2B & B2C 생체인증 서비스와 플랫폼을 제공하는 기업입니다. 직접 사이트를 정의하고 기능을 맞게 구현해야하는 과제입니다.
관련 링크 바로가기
담당 페이지
차트페이지
게시판 페이지
사용 기술 및 라이브러리
JavaScript, React, react-dom, react-router-dom, styled-components, axios, react-icons, antd, toast-ui-editor, react-apexcharts, dom-to-image, file-saver, Vite
주요 업무 및 담당 기능
Ant Design으로 로그인, 게시판, 메인 페이지 레이아웃 구현apexcharts를 활용하여 차트 레이아웃과 확대, 축소, 파일 저장 등의 기능을 구현dom-to-image과 file-saver를 활용하여 화면 캡쳐와 파일 저장 기능 구현toast-ui-editor를 활용하여 Markdown & WYSIWYG 에디터 기능, 게시글 작성 & 편집 기능 구현json-server를 활용하여 데이터 저장처음으로 진행한 개인 프로젝트로, 단 기간에 새로운 라이브러리들을 적용해보며 혼자서도 개발을 진행할 수 있다는 자신감을 심어준 프로젝트입니다. 다양한 라이브러리 사용을 위해 공식문서를 읽고, 예제도 활용할 수 있던 좋은 경험이었습니다.
기업 과제 소개
원티드 pre-onboarding, (주) 하이의 기업 협업 과제입니다. (주) 하이는 디지털바이오마커를 기반으로 정신 질환을 치료하는 소프트웨어 기반의 치료제 개발 기업입니다. <audio>태그와 오디오에 관련된 라이브러리를 최소화 해 진행해야하는 과제입니다.
관련 링크 바로가기
담당 페이지
사용 기술 및 라이브러리
JavaScript, React, react-dom, react-router-dom, styled-components, react-icons, wavesurfer.js, gh-pages
주요 업무 및 담당 기능
Audio()를 사용하여 오디오 재생, 일시정지, 중지 기능 구현 (링크 추가)wavesurfer.js를 사용하여 오디오 파형 구현성장한 점
<audio>태그와 라이브러리 사용을 최소화하라는 조건이 있어 고민을 많이 했던 과제였습니다. Audio()와 DOM을 활용하기 위해 자주 찾았던 MDN Docs를 가까이 하는 계기가 되었습니다.
기업 과제 소개
원티드 pre-onboarding, 비트바이트의 기업 협업 과제입니다. 비트바이트는 글로벌 서드파티 키보드, 플레이키보드를 서비스를 제공하는 기업입니다. 주어진 Figma 디자인을 활용해 UI를, 주어진 API를 통신해 배포를 완료해야 하는 과제입니다.
관련 링크 바로가기
담당 페이지
사용 기술 및 라이브러리
JavaScript, React, TypeScript, react-dom, react-router-dom, Sass/SCSS, Vite, axios, styled-components
주요 업무 및 담당 기능
lazy-sizes를 테마 이미지를 데이터 Lazy Loading 기능을 구현하여 로딩 속도 개선성장한 점
타입스크립트를 처음 사용해 본 프로젝트입니다. 타입스크립트를 사용하는 이유에 대해 알 수 있었으며, 이전 프로젝트에서 담당했던 부분과 비슷한 부분을 맡아 타입스크립트를 적용해보니 이전에 했던 것을 복습하는 동시에 새로운 것을 배울 수 있었습니다.