미리보기
기본 정보

안녕하세요. 혼자가 아닌 모두가 함께 성장하는 환경에 푹 빠져 개발자의 길로 들어서게 된 프론트엔드 개발자 김홍동입니다.
기술 스택
JavaScript, TypeScript, React, HTML/CSS, storybook, msw, Jest
프로젝트
하루스터디
우아한테크코스
2023.06. ~ 2023.12.
효율적인 공부 방법을 제공하는 학습 진행 도구 서비스
프론트엔드 3명, 백엔드 4명으로 구성
2023년 12월 기준 1400명 이상의 사용자 유치 및 900회 이상의 스터디 진행
사용기술: react, typescript, styled-components, msw, storybook, webpack
• 재사용 가능한 Calendar 구현
• 달력 기반 기간별 스터디 검색 기능 구현
• 필요한 데이터를 미리 불러오기 기능 구현
• 소셜 로그인 기능 구현
• 공통 컴포넌트 구현
• 번들, 이미지, 폰트 최적화
• 상호 코드 리뷰를 통한 팀 커뮤니케이션 강화
• 3인 페어 프로그래밍을 통해 코드에 대한 의견 공유
• 데일리 미팅을 통해 팀 구성원의 하루 감정 및 상태 공유
티처캔
기타
2021.11. ~ 진행 중
초등학교 선생님들의 업무를 도와주는 서비스
프론트에드 4명, 백엔드 2명으로 구성
평일 기준 평균 60명의 사용자 확보 및 에듀테크 기업인 티처빌과 협업 진행
사용기술: react, typescript, styled-components, apollo/client, react-hook-form
• Errorboundary를 사용한 선언적 에러핸들링 구현
• 비효율적인 업무 프로세스를 개선하기 위한 다양한 기능 구현
• 모두가 팀에 기여할 수 있는 문화 구축
• 매주 일요일 모임에서 배움을 통해 얻은 내용 및 어려웠던 점을 공유
• 최근엔 UX 개선, 코드 품질 향상, 코드 리뷰를 통한 소통을 높이고자 새로운 버전의 티처캔 서비스를 개발 중
포트폴리오
교육
우아한테크코스
사설 교육 | 웹 프론트엔드
2023.02. ~ 2023.11. | 졸업
춘천교육대학교
대학교(학사) | 초등윤리교육
2012.03. ~ 2018.02. | 졸업
자기소개
초등학교에 근무하던 시절, 교육 분야를 벗어나 다른 분야에서 자기 성장을 이루고 전문성을 확보하고 싶었습니다. 테니스, 드로잉 등 다양한 분야에 공부를 시도하였습니다. 하지만 저의 흥미를 크게 가져다 주지 못했습니다. 하지만 프로그래밍 공부는 지난 3년 동안 꾸준히 할 수 있었던 만큼 저에게 큰 흥미를 가져다주었습니다. 그 이유는 크게 두 가지가 있습니다.
첫 번째, 코드를 작성하면 결과를 화면으로 바로 볼 수 있어 성취감을 빠르고 많이 느낄 수 있었습니다. 처음 프로그래밍을 공부할 땐, 클론 코딩조차 매우 재미있었습니다. 매일 사용하는 카카오톡을 클론 코딩을 만들어 보면서 HTML, CSS에 대한 기초를 다질 수 있었습니다. 단순한 마크업이었지만 새로운 분야에 대한 도전이었기에 성취감을 느끼기엔 충분했고 이러한 성취감은 꾸준히 학습을 할 수 있는 원동력이 되었습니다.
두 번째, 함께 공부하는 즐거움을 경험할 수 있었습니다. 처음 자바스크립트와 리액트를 공부할 때, 많은 어려움을 겪었습니다. 배열의 고차함수는 물론이고 단순히 함수를 만들고 이를 여러 곳에서 호출하는 것조차 이해를 하지 못하였습니다. 또한 리액트의 컴포넌트의 분리도 이해하지 못한 채 유지보수가 어려운 컴포넌트를 만들곤 했습니다. 이러한 어려움을 혼자서 해결을 했다면 프로그래밍 공부를 포기했을 것 입니다. 하지만 주변 프로그래밍에 관심 있는 선생님, 그리고 퇴직을 한 후 우아한테크코스에서 만난 열정 있는 크루들 덕에 어려움을 해결할 수 있었고 지난 과거에 비해 많이 성장할 수 있었습니다.
2021년 하반기에 프로그래밍에 관심 있는 선생님들과 함께 팀을 만들었습니다. 티처캔이라는 초등학교 선생님들이 실제 학교 현장에서 사용할 수 있는 도구를 제공하는 서비스를 만들게 되었습니다. 해당 서비스를 만들면서 어떻게 하면 선생님들의 비효율적인 업무 프로세스를 개선할 수 있을지 많이 고민을 했습니다.
2023년에는 우아한테크코스에서 프론트엔드 3명, 백엔드 4명과 하루스터디 프로젝트를 진행했습니다. 뽀모도로 기반의 목표 설정, 학습, 회고의 3단계 과정을 사용자에게 제공하여 효용성 있는 스터디 경험을 전달하는 것이 핵심 가치인 서비스입니다. 스터디를 모집하는 플랫폼은 다양합니다. 하지만 스터디를 효율적으로 진행할 수 있는 도움을 주는 플랫폼은 없었기에 이를 타깃으로 잡고 서비스를 개발하였습니다.
저는 프로젝트에서 프론트엔드로서 디자인과 랜딩 페이지 및 스터디 기록과 관련된 기능을 맡았습니다. 스터디 기록과 관련하여 여러 기능을 계획하고 개발하면서 다양한 문제에 직면했습니다. 그중 가장 많이 고민했던 부분은 달력 컴포넌트의 재사용과 캐시를 활용한 데이터 저장 및 미리 불러오기입니다.
데이터 패칭을 통해 서버에서 스터디 기록을 가져와 달력에 렌더링해야 했습니다. 달력 컴포넌트 내에서 데이터 패칭을 한다면 달력 컴포넌트는 외부 데이터와 결합되어 재사용을 할 수 없었기에 공통 컴포넌트의 역할을 할 수 없었습니다. 따라서 달력의 기본적인 기능과 외부 데이터를 분리하고자 했습니다. 이는 합성 컴포넌트를 통해 해결할 수 있었습니다. 이와 같은 경험을 바탕으로 달력 라이브러리를 배포하였습니다. calendar-in-react라는 이름으로 라이브러리를 배포하였고 다른 프로젝트에서도 해당 라이브러리를 통해 달력을 쉽게 사용할 수 있게 되었습니다.
달력을 통해 혹은 기간 검색을 통해 사용자에게 특정 기간의 데이터를 보여줘야 합니다. 이때 서버와의 통신을 통해 데이터를 받아와야 합니다. 이러한 데이터를 필요한 시점에 불러오는 것이 아니라 사용자의 다음 행동을 예측하여 미리 불러올 수 있도록 했습니다. 또한 자주 바뀌지 않는 데이터는 한 번 불어온 뒤 저장하여 재사용할 수 있도록 했습니다.
문제를 직면하고 해결하는 과정에서 문제 해결에 대한 즐거움을 느꼈습니다. 또한 기술을 고민하고 탐구하는 과정에서 기술적 성장을 할 수 있었습니다. 단순히 코드를 복사 붙여넣기, 옮기기를 통해 기능을 구현하는 것이 아니라 코드에 대해 스스로 고민하고 탐구하는 과정을 경험하였습니다. 이와 같은 경험은 앞으로도 개발자가 되어서도 지속될 수 있길 바라고 있습니다.