Skills
Next.js, React.js, Storybook
- React.js로 환경 설정과 프론트엔드 개발에 필요한 전반적인 활동을 할 수 있습니다. (실제로 상용 오픈한 서비스도 많이 있습니다.)
- 개발 도중 npm 이나 yarn에서 제공하는 React.js 관련 라이브러리들을 사용할 수 있습니다. (react-query, react-hookform, yup)
- 상태관리를 위한 Zustand, Redux 등을 사용할 수 있습니다.
- Next.js와 Tailwind CSS를 사용하여 현 사이트를 구성하였습니다.
- Storybook을 사용하여 컴포넌트에 대한 공유나 문서화를 할 수 있습니다.
HTML5, CSS3, Tailwind CSS
- HTML과 CSS를 다루어 웹페이지 제작을 할 수 있습니다.
- Figma를 사용한 디자인과의 협의는 몇몇 기업의 기술과제를 수행하며 적응하였습니다.
- Next.js와 Tailwind CSS를 사용하여 현 사이트를 구성하였습니다.
JavaScript, TypeScript
- Javascript에 능숙합니다. ES6~ 문법에 익숙합니다. (spread 연산자, Object.entries 등)
- Typescript는 많이 사용하여 보았고, 최근 기술과제도 수행하며 적응하였습니다.
Java, SpringFramework, SpringBoot, Jquery
- Java Spring의 MVC 구조에 능숙합니다. JSP개발 경험이 많아 Jquery를 잘 다루었습니다.
- SpringBoot로 API 서버 정도는 작성할 수 있습니다.
- 프론트엔드를 하며 Jquery는 지양하고 있습니다.
Mysql, MariaDB, Oracle
- MySql, MariaDB, Oracle 모두 다룰 수 있습니다.
- SpringBoot로 간단한 서버를 만들시, MariaDB를 주로 사용합니다.
Linux, Apache Tomcat
- Linux 환경에 익숙하여 Apache세팅 등이 가능합니다.
- SpringBoot으로 서버를 빌드하여 Apache tomcat으로 구동할 수 있습니다.
Git, Jira
- Git, Jira를 협업 툴로 많이 사용하였습니다.
- Git로 소스 fetch, pull 및 branch 작업에 익숙합니다.
- 최근 기술과제들을 수행하며 Pull Request 생태계에 적응하였습니다.
- Pull Request시에는 feature branch를 주로 사용합니다.
Visual Studio Code
- VSCode를 주로 프론트엔드 개발시 사용합니다.
Json Web Token (JWT)
- JWT의 프로세스에 익숙합니다. (AccessToken, RefreshToken)
Projects
Devvreco : 개인 포트폴리오 사이트 (v.2)
2024.04 ~ ING
개인 프로젝트
- 기여도 : 100%
- Next.js + Typescript + Tailwind CSS
- HTML5 시맨틱 태그 (header, nav, section, footer) 사용한 문단 구분
- Next.js 사용하여 SSR 처리
- Tailwind CSS 사용하여 클래스 형태의 CSS 적용
- Storybook 적용으로 인한 컴포넌트 문서화
- Git과 Vercel을 연동하여 배포
- 개인 기술 블로그 작성글 -[미해결]포트폴리오 사이트 피드백 분석과 리뉴얼 개발과정
- 개인 기술 블로그 작성글 -[분석]반응형 UI - CSS 미디어쿼리(@media) 분기점 기준
HistoryBook : 개인 포트폴리오 사이트 (v.1)
2024.01 ~ 2024.04
개인 프로젝트
- 기여도 : 100%
- React + Typescript + Vite
- HTML5 시맨틱 태그 (header, nav, section, footer) 사용한 문단 구분
- App.css와 Section별 css(stacks.css 등..) 사용하여 각 항목별 디자인
- Material-UI를 사용한 제목(Typography), 영역(Box) 처리
- React-markdown을 사용하여 내부 MD파일 내용으로 PROJECTS 단의 화면 구성
- Vite build로 인한 빠른 build, Vitest 라이브러리를 사용한 테스트코드 작성 시도
- Github Action 적용을 통한, 소스 push에 따른 자동 CI/CD
- 개인 기술 블로그 작성글 -[해결]포트폴리오 테마 변경하기 (부제: 컬러감 찾기, 부제2: 스타일 찾기)
- 개인 기술 블로그 작성글 -[미해결][트러블슈팅] React - Test Code에서 fetch 사용하기 이슈
Hdms Camel : 임상연구사업 관리 통합플랫폼 HDMS 서비스 Camel버전
2023.04 ~ 2024.01
현업 프로젝트
- 기여도 : 70%
- React.js 18 + Material-ui 및 React-hookform, yup validation, React-query
- 임상연구 도메인의 이해와 Admin, eCrf, PRO, Imaging, Safebox, Community 구현
- ES6, ES8 문법 (Spread 연산자, Object.entries) 사용
- Input, Select 등 HTML 구성 요소들에 대한 공통 컴포넌트화. 이들의 조합 배치로 UI 구성
- React-query를 사용한 CRUD 적용, Zustand를 이용한 상태 관리
- React-Hookform과 yup resolver를 활용한 입력성 화면의 validation 체크
- TinyMCE → SunEditor로 WebEditor 교체
아파트청약케어 : 아파트관련 이통사 부가서비스
2020.11 ~ 2022.04
현업 프로젝트
- 기여도 : 70%
- React.js + Kakao Map API
- Kakao Map API (지도, 주변정보 등) 를 활용한 아파트 정보, 아파트 청약정보, 아파트 추천, 로그인, 회원가입 프론트엔드 (React.js) 개발
- 공공데이터 건축물대장, 실거래가 API 동작에 따른 DB 확인
- Flutter (WebView)
- Flutter 별도 APP의 WebView구현과 Flutter Native를 호출할 수 있는 인터페이스 정의
- Java SpringBoot + MariaDB
- Java SpringBoot (SpringBoot 4) 백엔드단 개발과 로그인 필수 메뉴의 접근을 제어하기 위해 JWT(Json Web Token) + Spring Security 적용
- Linux CentOS의 기업 내 자체 인프라 - 온 프레미스 (On Premise)
- WEB 서버 2대, WAS 서버 2대, DB 서버 1대 형상의 L4를 통한 Round-robin. WEB-WAS 간 Apache ajp (mod_jk) 설정을 통한 서버 간 연동
- 타 직군 (기획, 디자인 UI/UX) 담당자 협업 - 개발 방향 논의 결정 및 서비스 내 사용 그래프 rMateChart 라이브러리 선정
- 타 직군 (CS, 보안, 마케팅, QA) 담당자 협업 - CS처리, ISMS 관련 요구사항 등
- 타 회사 (부동산 114, 리아모어소프트) 컨택
이통사 부가서비스 6종 : LOP / SPM / 주투 / 슈퍼 / 알파 / PNS
2019.09 ~ 2021.08
현업 프로젝트
- Java SpringFramework (Jdk1.8) + JSP, Apache Tomcat
- 회사 주력 부가서비스 유지보수 : LOP, SPM, 주투, 슈퍼, 알파, PNS
- 2021년 이전 : LOP, SPM, 주투, 슈퍼, 알파, PNS - [부]담당자
- 2021년 : 주투, 슈퍼 - [정]담당자 / LOP, SPM, 알파 - [부]담당자
- 기획문의 대응, Admin 백오피스 개선 대응, 유지보수
- CS문의 대응, 보안 대응, 예상 매출 산출 등 기획 외 타부서 협업
