미리보기
기본 정보

저는 프론트엔드 분야에서의 직무역량 향상을 위해 항상 최신 기술 동향을 주시하고 프로젝트에서 필요한 기술적 역량을 강화하기 위해 지속해서 학습하며 노력하고 있는 프론트엔드 개발자 이인우입니다. 기술에 대한 공식 문서 정독, 교육 자료 수강, 간단한 사이드프로젝트 등을 하여 실무에서 익숙하게 다룰 수 있도록 노력하고 , 실질적인 사용 경험을 통해 기술 역량 향상시키고 있습니다. 또한, 프론트엔드 개발자 사이에서 주목되고 있는 Storybook, React기반의 Next.js등에 대해 꾸준히 학습하며, 계속해서 기술의 변화에 발맞춰 더 효율적이고 품질 높은 웹사이트를 개발하기 위해 노력하고 있습니다.
기술 스택
TypeScript, Docker, JavaScript, Node.js, Next.js, React, Jenkins, NestJS, react-query, tailwind-css, HTML/CSS, MariaDB, TypeORM
교육
전주대학교
대학교(학사) | 컴퓨터공학
2019.03. ~ 2023.02. | 졸업
경력
(주)라바웨이브
Manager | 서비스 개발팀 | 재직 중
2022.08. ~ 재직 중 (2년 7개월)
디지털 성범죄 대응 기업인 라바웨이브의 서비스 개발팀으로서 내외부 웹 서비스 개발, 프로젝트 기획, 빌드 및 배포 자동화 환경 구축 업무를 진행하였습니다.
프로젝트
SD(SolutionDemo)
㈜라바웨이브
2024.10. ~ 2024.12.
링크
프로젝트 설명
차별화된 솔루션 전문성을 직접 체험할 수 있는 콘텐츠 제작으로 피해자 유입 증가와 유입 피해자 전환 목표로 진행한 솔루션 체험 홈페이지 제작
담당역할
프로젝트 리더
Front-End 개발
담당 수행 업무
팀 역할 분담 및 의사소통
프로젝트 일정 조정
기능 요구사항 분석 및 와이어 프레임 제작
프로젝트 기능 및 모션 명세서 작성
각 모바일, 태블릿, PC 등의 사용자를 위한 반응형 웹페이지 제작
각 솔루션 더미데이터, 데이터 인젝션 페이지 Front-End 개발
Semi-Atomic 패턴 기반으로 컴포넌트 개발
사용자의 체험을 더욱 원활하게 돕기 위한 튜토리얼 로직 및 UI 제작, 인터렉티브 모션 구현
사용 기술 스택
React.js, Next.js, Emotion.js, framer-motion, FxTS, ts-pattern, NX Workspace, faker.js
TW(The Wave)
㈜라바웨이브
2024.05. ~ 2024.07.
링크
프로젝트 설명
기업 정체성과 브랜드 이미지를 확립하는 것을 목표로 진행한 홈페이지 개발
채용 홈페이지, 기술 블로그 등 여러 채널의 확대 가능성 有
담당 역할
Front-End 개발
내부 컨텐츠 작성
담당 수행 업무
홈페이지 스크롤 위치에 따라 렌더링되는 동적 Header 컴포넌트 제작
LightHouse를 통해 홈페이지 성능, 접근성, 권장사항, SEO 개선
내부 컨텐츠(Job Interview) 작성
이미지 용량 압축을 통해 이미지 로딩 속도 개선
=> 웹 페이지 로딩 속도 개선구글, 네이버 색인 생성
사용 기술 스택
React.js, Next.js, Emotion.js, react-query, framer-motion, FxTS, ts-pattern, NX Workspace, zx
WCO(WebChangeOver)
㈜라바웨이브
2024.02. ~ 2024.04.
링크
프로젝트 설명
유지보수성 및 성능 향상을 목표로 진행하는 홈페이지 리뉴얼
담당 역할
Front-End 개발
담당 수행 업무
기존 홈페이지 사용자 인터페이스를 Atomic 패턴 기반으로 리뉴얼
=> 가독성 증진, 재작성되고 충돌되는 코드의 양을 감소시켜 효율성 증진NX Workspace plugin을 통해 클라이언트, 서버, 코어 모듈, shared 모듈, 엔티티, 타입 등 다양한 종류의 프로젝트 및 파일들을 간단하게 생성할 수 있도록 제너레이터 개발
TailwindCSS 기반의 컴포넌트 CSS를 제거하고, Emotion styled 패키지를 활용하여 컴포넌트 디자인 적용
유지보수성 및 성능 향상을 목표로 자사 홈페이지 리뉴얼 진행
=> Lighthouse 90+ 및 유저 시나리오 별 성능 비용 50% 이상 감소 목표Client, Admin 페이지 Front-End 개발
트래킹 코드 삽입 (GoogleAnalytics, Naver 추적코드, 카카오픽셀 등)
사용 기술 스택
React.js, Next.js, Emotion.js, react-query, framer-motion, FxTS, ts-pattern, NX Workspace, zx
DS(Design-System)
㈜라바웨이브
2024.01. ~ 2024.04.
프로젝트 설명
신규 서비스 오픈에 빠르고 효율적으로 대비하고 일관적인 UX를 제공하기 위한 디자인 시스템
담당 수행 업무
테스트케이스 작성
컴포넌트 명세 작성
VAC 패턴 기반의 컴포넌트 구조 적용
NameSpace 컴포넌트 패턴 기반으로 제작
각 컴포넌트 Storybook 구축
Emotion.js 를 활용하여 컴포넌트 스타일 (CSS-in-js) 적용
사용 기술 스택
Next.js, React.js, Nx Monorepo, Emotion.js, Storybook, MUI, Jest
모니터링 자동화 시스템
㈜라바웨이브
2023.08. ~ 2023.12.
프로젝트 설명
마케팅부서에서 자사 특정 키워드를 검색하여 모니터링하는 고정 업무의 시간을 효율적으로 단축하기 위해 키워드 크롤링 기술을 활용하여 모니터링 자동화 시스템 개발
24시간 자동 모니터링
담당 역할
PO 및 풀스택 개발
담당 수행 업무
플로우차트 및 요구사항 명세서 제작
API 명세서 작성
ERD 설계
Node.js 런타임 환경에서 Chrominum을 제어할 수 있는 puppeteer 라이브러리를 활용하여 키워드 크롤링 로직 구현
Nest.js 패키지인 Cron을 활용하여 매 30분마다 크롤링 실행 구현 (자동화)
Next.js 기반의 대시보드 페이지 개발
Semi-Atomic 패턴 기반으로 컴포넌트 개발
react-query를 활용하여 데이터캐싱을 통해 서버 부하 감소
Nest.js 기반의 데이터 API 개발
Google Oauth 인증 로직 구현
GoogleChat 웹훅을 통한 Notification 기능 구현
페이지 접근 권한 로직 구현
Jenkins 파이프라인 작성
사용 기술 스택
FE : Next.js, TailwindCSS, Axios, Recoil, react-query,Emotion.js
BE : Nest.js, puppeteer, OAuth ,TypeORM
Infra: Docker Jenkins, mariaDB, Nginx,
F.Component 라이브러리 개발
㈜라바웨이브
2023.02. ~ 2023.05.
프로젝트 설명
UI 개발 시 사용되는 각 컴포넌트들이 프로젝트나 서비스에 따라 기능은 같지만 UI는 달리 구현되는 경우를 고려하여 컴포넌트의 기능적 역할만 구현한 컴포넌트 라이브러리 제작
담당 수행 업무
UI-less (Functional) 컴포넌트 라이브러리를 구축
NameSpace 컴포넌트 패턴 기반으로 제작
추후 서비스에 따라 UI를 입혀 사용할 수 있도록 설계 및 구축
React Hook을 활용하여 컴포넌트 기능 구현
Emotion.js를 활용하여 컴포넌트 Default UI 적용
사용 기술 스택
FE : React.js, Emotion.js
테스트 : RTL, Jest
서버 : Nginx, Docker, verdaccio(registry)
이 프로젝트로 진행하면서 컴포넌트들의 기능이 돌아가는 로직에 대해 알게 되었고, 다음 프로젝트를 진행할 때 자사 내부 개발자들이 해당 라이브러리를 사용함으로서 편의성 제공과 개발 속도를 증진 시킬 것이라고 생각합니다.
자사 홈페이지 리뉴얼
㈜라바웨이브
2022.09. ~ 2023.01.
프로젝트 설명
외주사에 맡긴 php 기반의 자사 홈페이지를 JS 기반으로 리뉴얼 및 개발 진행
담당 역할
Front-End 개발
담당 수행 업무
ERD 설계
Client페이지 Front-End 개발
Next.js 기반의 SSR 웹사이트 개발
StyledComponent, TailwindCSS를 활용하여 각 페이지 레이아웃 및 컴포넌트 스타일(css) 적용
Graphql에 특화되어 있는 Apollo Client패키지를 활용하여 데이터 호출(mutation, query)
GoogleAnalytics 및 카카오 태그 매니저등 반복되는 스크립트 삽입 로직 구현 및 유지보수
사용 기술 스택
FE : Next.js, React.js, StyledComponent, TailwindCSS, Recoil
BE : ExpressJS
공통 : apollo
Infra : Docker, Nginx, Jenkins
이번 프로젝트 경험을 통해 Front-End 개발자로서, 한 단계 성장하게 되었습니다.
온보딩 프로젝트 TIL 사이트 제작
㈜라바웨이브 (인턴 활동)
2022.06. ~ 2022.07.
프로젝트 설명
입사하고 첫 진행 프로젝트
오늘 하루 스터디한 내용에 대해서 간단하게 적을 수 있는 블로그 사이트 개발
담당 역할
전반적인 기획 및 풀스택 개발
담당 수행 업무
React.js 기반의 SPA 웹사이트 제작
Axios 기반의 서버 HTTP 통신 구현
Recoil을 활용하여 전역 데이터(로그인 유저) 상태 관리
TailwindCSS를 활용하여 컴포넌트 CSS 적용
Nodejs 런타임 환경에서 ExpressJS를 활용하여 데이터 API 개발
사용 기술 스택
FE : React.js, Axios, TailwindCSS, Recoil
BE : Express.js
Infra : Docker, Nginx, FireBase(NoSql)
위와 같은 풀스택 경험을 통해 웹개발자로써 더욱 성장할 수 있는 기회가 되었습니다.
포트폴리오
자기소개
'애자일'한 개발자 이인우라고 합니다. 저를 애자일한 개발자라고 할 수 있는 저의 3가지 핵심 역량이 있습니다.
첫째, 저는 개인의 소통을 중요하게 생각합니다. 프로젝트에서 팀과의 협업을 통해 항상 서로 예의를 갖추며 각자 맡은 파트에 대해 배려하고 개발하면서 도움이 필요한 부분에서는 재빠르게 다가가 도움을 주며 팀 개개인과의 상호 작용을 중시합니다.
둘째, 저는 계획, 고전적, 수동적인 것보다는 유동적이며, 변화에 대응하기 위해 빠르게 바뀌는 기술 트랜드에 맞춰 학습하고 성장합니다.
IT 기술은 다른 기술들에 비해 변화의 속도가 빠릅니다. 그래서 하나의 기술만이 아닌 다양한 기술들을 경험하며 빠른 기술 변화에 대처해야 한다고 생각하여 평소 React.js, Next.js, Vue.js, Svelte 등과 같은 프레임워크와 상태관리, CSS, CI/CD등과 같은 다양한 기술들을 접하며 성장하고 있습니다.
셋째, 저는 고객과의 소통을 한 시도 놓치지 않으며, 빠르게 동작하고 반영하기 위해 노력합니다.
개발 과정 중에서 사용자의 요구 사항이 바뀌는 상황에 대처하고 동작하기 위해 저는 사용자 기능들을 미리 컴포넌트화하여 개발을 진행합니다. 그리고 테스트 배포 혹은 서비스 배포 시, 항상 테스트 사용자의 피드백을 통해 니즈에 맞지 않는 레이아웃이거나 문구, 기능들은 가차 없이 사용자가 원하는 디자인, 기능에 맞춰 수정 후 틈틈이 리팩토링을 진행하여, 다시 사용자에게 빠르게 서비스를 제공하여 사용자의 만족이 100%가 되도록 이끌어내고 있습니다.
저의 이러한 역량을 기반으로 항상 맡은 업무에 최선을 다하며 회사의 목표를 달성하는 데에 일익을 담당할 수 있는 인재가 되겠습니다.
성격의 장단점
저의 가장 큰 장점은 추진력입니다. 저는 한번 마음먹은 일은 반드시 끝까지 해내는 타입으로, 일을 마치지 않으면 잠을 자지 않을 정도로 강한 집념을 가지고 있습니다. 이러한 집요함 덕분에 친구들과의 일상, 동아리 임원으로서의 업무, 프로젝트 진행 등 다양한 상황에서 성공적인 결과를 만들어낼 수 있었습니다. 각각의 상황에서 친구, 임원진, 프로젝트 일원으로서 지켜야 할 덕목이 많지만, 그중에서도 추진력은 매우 중요한 덕목이라고 생각합니다. 저는 생각이 떠오르면 즉시 행동으로 옮기고, 그 행동이 완성될 때까지 끝까지 노력하는 사람입니다.
또한, 저는 웃음이 많아 사람들과 금방 친해지는 편입니다. 붙임성이 좋아 사람들과 만나는 것을 즐기며, 항상 웃음을 잃지 않으려고 노력합니다. 이런 성격 덕분에 주변 사람들과 원활한 관계를 유지하고, 팀워크를 강화하는 데 큰 도움을 주고 있습니다.
그러나 저의 단점으로는 목표에 몰입하는 경향이 있어 식사나 수면을 소홀히 하는 경우가 있다는 점입니다. 일을 할 때는 집중력이 뛰어나지만, 건강을 유지하기 위해 이러한 습관을 고치려고 노력하고 있습니다. 최근에는 건강 관리의 중요성을 깨닫고, 적절한 휴식과 식사를 챙기기 위해 의식적으로 노력하고 있습니다.
장래포부
사람들은 일을 통해 성취감을 느낄 수 있으며, 이러한 성취감은 우리에게 늘 보람을 안겨줍니다. 저희 개발자들에게는 시스템을 개발하고, 그 개발된 시스템을 사용하는 고객들에게 편리하고 좋은 서비스를 제공하는 것이 바로 그 성취감의 원천입니다. 저는 이러한 성취감을 함께 경험하고 싶습니다.
그동안 프로젝트를 진행하며, 저는 프론트엔드(FE) 기술을 활용한 웹서비스 개발을 수행해 왔습니다. 또한, CI/CD 환경을 구축하며 배포 자동화도 경험해 보았습니다. 이러한 경험들을 토대로 다양한 기술 발전에 도움이 될 것이라 생각합니다.
저는 전공과 그동안의 다양한 개발 경험을 통해 변화하는 기술에 앞서가며 성장하는 개발자가 되고자 합니다. 앞으로도 꾸준히 기술을 탐구하고, 지속적인 성장을 통해 더욱 뛰어난 개발자가 되겠습니다.