김진근

주니어 프론트엔드 개발자

디자인과 UI/UX에 관심이 많은 주니어 개발자 김진근입니다. 주로 Typescript와 React, Nextjs를 사용해 웹 프론트엔드를 개발합니다. React Native로 iOS와 Android 앱 개발을 할 수 있습니다. UI/UX, 특히 UX에 관심이 많습니다. 더 나은 UX를 만들기 위해 고민하고 디자인합니다. 참여한 대부분 프로젝트에서 프론트엔드 개발과 제품 디자인을 맡았습니다. '어제의 나보다 성장한 오늘의 나'가 되기위해 노력합니다. 뛰어난 사람이 되기 위해 끊임없이 공부합니다. 웹에서 보기

경력

Logo
매쓰팡
프론트엔드 개발자
2022.11 ~ 2024.02

매쓰팡에서 웹 프론트엔드 개발과 크로스 플랫폼 앱 개발을 맡았습니다. 2024. 01 - 멤버십 구독 기능을 개발하였습니다. 매월, 매년마다 결제되는 구독 기능을 개발하였습니다. 2023. 11 - 타겟 사용자가 느린 네트워크와 느린 기기를 사용하는 경우가 많았기에 유저 경험 개선과 개발 경험 개선을 위해 Next.js 마이그레이션을 제안하였습니다. 하지만 오래된 코드를 이전하는 것은 개발과 테스트에 많은 시간이 걸리고 중간에 다른 기능을 넣기도 힘들기에 점진적으로 마이그레이션 하는 방향을 선택했습니다. Next.js의 rewrites 설정을 이용해 페이지 하나하나 마이그레이션 할 수 있도록 했습니다. - 마이그레이션 된 페이지에서는 유저들이 더 빠르게 페이지를 볼 수 있도록 SSR을 적용해 First Contentful Paint를 개선하였습니다. 2023. 07 - 앱 개발에 집중하고 구글 플레이 스토어에 앱을 출시 하였습니다. 웹으로 되어있던 서비스를 앱의 웹뷰로 띄워서 앱처럼 보이도록 하였습니다. 로그인 세션 유지와 인앱 결제를 개발하였습니다. 2023. 04 - 웹 초기 로딩 속도가 느린 문제의 원인이 사용하지 않는 코드를 가져오고 있다는 것임을 알고, 라우터 기반 코드 분할을 통해 로딩 속도를 90% 개선하였습니다. - 캐시 관리와 편리한 fetching을 위해 react query 도입을 제안하였습니다. 캐시와 편리한 hook 지원으로 유저 경험과 개발자 경험이 향상되었습니다. 2023. 03 - React Native를 사용하여 매쓰팡 앱 개발을 시작하였습니다. 팀원분 중에서 React Native를 개발해보신 분이 없어서 개발 경험이 있는 저를 중심으로 진행되었습니다. 기존 앱과 웹뷰간의 이벤트 방식의 메시지 송수신을 Promise 기반의 새로운 방식으로 송수신 할 수 있도록 개선하여, 코드의 흐름을 한눈에 볼 수있어 개발 경험이 향상되었습니다. 2022. 11 - 코드 리뷰를 효율적으로 하기 위해 Pn룰 도입을 제안하였습니다. 도입 후 한눈에 코드 리뷰의 우선순위를 볼 수 있게 되어서 리뷰 시간이 줄었습니다.

Logo
모두닥
프론트엔드 엔지니어
2022.07 ~ 2022.10

모두닥에서 3개월동안의 인턴생활을 하였습니다. 그 동안 React Native를 사용해 모두닥 앱 개발과 바닐라JS를 사용해 Django 프론트엔드 웹 개발을 하였습니다. 모두닥 웹의 검색 Flow를 개선했습니다. 모두닥 앱의 예약 상태 화면을 개선했습니다. 웹/앱의 버그, 이슈를 해결했습니다. 스프린트에 참여해 빠르게 문제를 찾고 문제를 해결할 수 있는 아이디어를 실험하고 결과를 내는 과정을 경험해보았습니다.

내가 참여한 프로젝트들

Project Image
Knowing

자세히 보기 사용자끼리 질문답변을 영상으로 주고 받을 수 있는 숏폼 Q&A 서비스입니다. 디자인React Native 개발로 참여하였습니다. React Native의 Expo를 사용하여 개발 환경을 설정하였습니다. styled component를 사용해 스타일을 관리하였습니다. 사용자는 숏폼 영상으로 서비스의 모든 사용자에게 질문을 남길 수 있습니다. 답변은 영상 또는 글로 할 수 있습니다. 모든 영상은 틱톡, 릴스와 같은 형식으로 사용자가 가볍게 조작 할 수 있습니다.

Project Image
Teamit

자세히 보기 사용자가 간편하게 온라인 웹 상에서 학교 프로젝트와 보고서 관리쉽게 할 수 있도록 하는 서비스입니다. 디자인프론드엔드 웹 개발로 참여하였습니다. 웹 개발은 React jsTypescript를 사용하여 개발하였습니다. Emotion의 styled component를 사용해 스타일을 관리하였습니다. 학교장 인증제를 위해 프로젝트 보고서를 작성하여 선생님께 제출해야 하는데 모든 과정이 오프라인으로 진행 되어서 불편하였습니다. 이런 불편함을 고치기 위해 온라인 상에서 모든 과정을 진행 할 수 있도록 서비스를 기획하였습니다.

Project Image
Functions

자세히 보기 데스크톱 웹 환경에서 재미있는 기능화려한 애니메이션과 함께 체험할 수 있는 사이트입니다. 디자인과 웹 개발에 참여하였습니다. React jsTypescript를 사용해 개발하였습니다. GSAP를 사용해 에니매이션을 관리했고, three js, cannon js를 사용하여 3D 물리를 웹에서 구현해보았습니다. 재미있게 구현한 기능은 지뢰찾기, 주사위 굴리기입니다. 일반적인 지뢰찾기, 주사위 굴리기와 달리 많은 애니메이션과 다양한 사용자 경험을 체험해 볼 수 있습니다.

Project Image
휘뚜루마뚜루

자세히 보기 자신이 쓴 일기를 다른 사용자 한명과 주고 받을 수 있는 서비스입니다. 디자인프론트엔드 웹 개발에 참여했습니다. 웹 개발은 Next jsTypescript를 사용하여 개발하였습니다. 사용자는 랜덤 매칭이나 코드로 일기를 교환할 상대를 선택합니다. 그리고 일기를 작성하여 상대방과 일기 교환을 시작합니다. React js단점보완하고 개발의 편의성의 위해 Next js를 사용하여 웹 개발을 하였습니다.

Project Image
김진근의 devlog

개발하며 공부하고 공유하고 싶은 것을을 게시하는 기술 블로그를 개발하였습니다. 📚 기술스택 - nextjs - typescript - nextui - emotion 🎉 배포 - vercel

내가 쌓아온 능력

HTML5 & CSS3 ⭐⭐⭐

웹 개발의 기본이 되는 HTML5와 CSS3를 공부하였고 좋은 수준으로 다룰 수 있습니다.

React js ⭐⭐⭐

조금 더 편리한 사용자 인터페이스 제작을 위해 React js를 공부하고 실제 여러 프로젝트에 사용해 본 경험이 다수 있습니다. Hook과 Functional Component를 좋은 수준으로 다룰 수 있습니다.

Next js ⭐⭐

React js 개발하고 서비스 할때 느낀 단점을 보완하고 개발의 편리함을 위해, 서버 사이드 렌더링을 지원하는 Next js를 공부하였습니다. 진행 중인 여러 프로젝트에 사용하고 있습니다.

Javascript ⭐⭐⭐

웹 환경에서 사용자와 상호작용을 하기 위해 사용되는 Javascript를 공부하고 실제 프로젝트에서 사용한 경험이 있습니다.

Typescript ⭐⭐⭐

Javascript를 개발하며 느낀 단점인 강한 타입 체크를 하기 위해 Typescript를 공부하였습니다. Typescript를 공부하고 프로젝트에 적용하며 개발과 협업이 조금 더 쉬워졌음을 경험했습니다.

MySQL ⭐

지방기능경기대회와 전국기능경기대회 정보기술 분야에 출전했을 때, 문제 해결을 위해 MySQL을 공부하고 사용해보았습니다. Java 프로그램과 같이 사용하여 데이터베이스 관리를 경험해보았습니다. 프론트엔드 개발 할때에는 사용하지 않지만, 백 엔드 개발자와 소통할 때에 큰 도움이 될 것이라 생각합니다.

React Native ⭐⭐

참여한 프로젝트인 Knowing에서 앱 개발이 필요하여 팀원과 React Native를 공부하고 사용하였습니다. React Native의 기본 지식은 앱 개발자와의 소통에서 유용하게 사용 될 수 있습니다. 또한 프로젝트 진행 중, 여러가지 상황에 유연하게 대처할 수 있는 능력이 된다고 생각합니다.

Github & Git ⭐⭐⭐

팀원과 안정적이고 관리하기 쉬운 협업을 하기 위해 Git과 Github를 사용한 경험이 있습니다. 참여한 모든 프로젝트에서 Github를 사용하였습니다.

Figma ⭐⭐⭐

Figma를 능숙하게 다룰 수 있습니다. 참여한 모든 프로젝트에서 디자인과 UI/UX 개발저의 주도 아래 진행하였습니다. 이런 경험은 프론트 엔드를 개발하면서 사용자에게 더 좋은 경험을 제공할 수 있는 능력이 된다고 생각합니다.

styled compoent ⭐⭐⭐

CSS In JS 기술인 styled component를 다룰줄 압니다. 참여한 대부분의 프로젝트에서 styled compoent를 사용하여 스타일 관리를 하였습니다.

활동

2021 지방기능경기대회 동상 수상
정보기술 분야
2021-04-05 ~ 2021-04-09

학교에서 지방기능경기대회에 참여할 수 있는 기회를 가지게 되어서 정보기술 분야에 참여하였습니다. Java와 MySQL을 사용하여 주어진 응용 프로그램을 개발하는 것이 목표였습니다. 대회 준비를 하며 Java와 MySQL을 공부한것이 개발자로서 많은 도움이 되었습니다. 많은 노력끝에 동상을 타게 되었습니다.

2021 전국기능경기대회 참여
정보기술 분야
2021-10-04 ~ 2021-10-11

지방기능경기대회에서 메달권에 들어가서 전국기능경기대회에 참여할 자격을 얻게 되었습니다. 끝까지 가보자는 마음으로 정보기술 분야에 참여하게 되었습니다. 아쉽게도 상을 타진 못했지만 많은 사람과 경쟁하며 배운 Java와 MySQL의 지식이 개발자로서의 좋은 경험이 되었다고 생각합니다.

2021 소프트웨어마이스터고등학교 연합 해커톤 참여
프론트 엔드 개발로 참여
2021-11-24 ~ 2021-11-26

다른 소프트웨어마이스터고등학교 팀원들과 연합 해커톤을 진행하였습니다. 거의 모르는 사람과 프로젝트를 진행하는 경험이 특별하였습니다. 안드로이드 앱과 웹뷰를 처음 연결해보는 것이여서 좋은 경험이 되었습니다.

정보처리기능사 취득
2021-04-19

Powered by