강민석(MinSeok Kang)
✉️ kthrkdals@gmail.com
📞 010-9081-7876
Gihub : https://github.com/ainochi-kor
LinkedIn : https://www.linkedin.com/in/민석-강-508191248/
자기소개
수학에서는 증명하지 않아도 참이라는 ‘공리’라는 단어가 있습니다. 저는 공리라고 믿고 있는 것들의 의문을 제기하고 이유를 찾는 것을 좋아합니다.
"5개월 동안의 전략적인 접근으로 재사용자 비율이 100% 증가하였습니다."
팀과 함께 데이터 분석 툴(Hotjar)을 사용하여 유저의 행동 패턴을 관찰하였습니다. 유저 이탈을 방지하고 체류 시간을 늘리기 위해 가설을 설정하여 실험하여 5개월 동안의 전략적인 접근으로 재사용자 비율이 100% 증가하였습니다. 웹페이지 성능을 위해 코드 분할 및 관리하여 유저 체류 시간을 늘리는데 집중하였습니다.
"극적인 검색 엔진 최적화를 통해 최상단 노출에 성공하였습니다."
META 태그와 Open Graph 등 직접적인 영향을 주는 작업과 SSR과 ISR, SSG 설정을 통해 각 페이지마다 검색이 되도록 하였고, 페이지 성능을 99점까지 끌어올려서 검색 최상위 노출에 성공하였습니다.
"대형 리스트 생성 시간을 15초에서 1초 이내로 단축했습니다."
e스포츠 데이터 분석하는 플랫폼을 구축으로 유저들이 효과적인 콘텐츠 제작을 할 수 있도록 제작했습니다. 필터를 제작하던 중 5,000여 개 전체 경기를 생성하는 데 15초가 걸리는 문제가 발생하였습니다. 해당 문제를 대형 리스트 가상화를 통해 1초 이내로 생성하였고, 라이브러리를 뜯어보고 블로그로 정리하였습니다.
요즘 관심사
- 모든 클라이언트
클라이언트의 모든 것을 경험해보고 다룰 수 있는 사람이 되고 싶어 웹사이트뿐만 아니라 현재 React-Native를 통한 모바일 앱개발을 하고 있으며 TV, Watch, VR 앱 등 모든 클라이언트를 개발하는 목표를 가지고 있습니다.
- 1인 창업을 돕는 Saas 플랫폼 개발
1인 창업가들이 겪고 있는 문제들을 공감하며 기술적으로 해결할 수 있는 플랫폼을 개발하는 것에 관심이 많습니다. 점차 알바를 쓰지 않는 1인 창업 시장이 확대되고 있기에 관심을 가지고 있으며 프로젝트 팀을 운영하고 있습니다.
- 모던한 프론트엔드를 넘어
: 현재 작은 FE 모임을 운영하고 있으며, 개발자들 간의 네트워킹 및 기술 서적 읽는 것을 좋아합니다. 그 속에서 배운 것을 토대로 모던한 프론트엔드 환경을 구축하기 위해 노력하였습니다.
주로 사용하는 구성
React.js, Next.js, Typescript, Turborepo 경험 및 성과
팀스노우볼
2021.09 ~ ing
E-Sports 빅데이터 분석 회사에서 FE로 근무.
Potpicks.io (beta)
Tech:React.js,Next.js,Typescript,tailwindcss,Tanstack-Query,zustand
: 전세계 유저들이 사용할 수 있는 다국어 신규 베팅 플랫폼으로 유저들의 신뢰를 얻기 힘든 문제가 있습니다. 이를 UI/UX와 성능을 통해 해결하고자 하였습니다.
app-router에서 서버 컴포넌트를 사용하여 불러오는 Javascript의 양을 줄여 성능 최적화.
next-intl를 이용하여 다국어 호스팅.- Google SpreadSheet로 작성된 것을 python의
gspread라이브러리를 통해 json 파일 작성하는 스크립트를 ChatGPT를 이용하여 작성 및 활용.
searchParams를 통해 Filter를 구현하여 유저가 선택한 필터를 기록하여 재접근이 쉽도록 구현.
sokect을 이용한채팅서비스 지원(지원 중단)
WA.GG Project
Tech:React.js,Next.js,Typescript,tailwindcss,Tanstack-Query,zustand,firebase
: e스포츠 선수들의 평점을 보여주고 유저들의 게임 전적으로 유저들끼리 경쟁을 하여 보상을 주는 커뮤니티 사이트를 개발하였습니다.
- 코드의 반복을 줄이기 위해 첫
모노레포(turbo) 프로젝트구축.
SSE를 통해 클라이언트에서 실시간 포인트 알림 시스템 구축.
Promise.all을 통한 비동기 병렬 처리를 통한 속도 개선.
- HTTP 상태 코드를 통한 불필요한 렌더링 최소화.
eslint,prettier,husky&lint-staged를 이용한 commit 문화 개선.
- 패키지 매니저 변경으로 build 속도 54% 개선
yarn→pnpm(vercel 배포 기준)
Riot Games, KeSPA(한국 e스포츠협회) 프로덕트 개발
Tech:Next.js,Typescript,tailwindcss,swr,zustand,firebase
- 고객의 요구로 5000건 이상의 데이터를 리스트 컴포넌트로 그리는데 15초 이상 걸리는 문제 발생.
→ react-window를 이용하여 효율적인 대형 리스트 가상화를 통해 문제를 해결하고, 오늘 경기로 이동할 수 있도록
auto scroll기능 구현 추가.
- REST API의 단점인 언더패칭, 오버패칭 문제 해결을 위해
GraphQL사용. → 유저 인터랙션에 피드백을 주기 위해useLazyQuery에 Optional Loading 속성 추가.
- 코드 분할을 활용하여 모든 Modal 컴포넌트를
Lazy를 통해 컴포넌트 마운트 된 이후에 불러오도록 수정.
Betjoy.ai Project (서비스 종료)
Tech:Next.js,Typescript,tailwindcss,swr,recoil,firebase
: 스포츠 데이터 분석을 통해 AI가 승리를 예측하고 베팅 금액을 추천해주는 프로덕트.
- 검색 결과의 상단에 이미 betjoy라는 이름의 다른 웹사이드 다수 노출. → SEO를 최고로 만들기 위해 PM/마케터와 함께 SEO를 가장 많이 노력했던 Global 프로젝트.
next-seo를 이용한 각 페이지에 따른title과description설정.
page-router를 이용하여 정적 페이지를 미리 생성.
Decakill Project (서비스 종료)
Tech:React,Typescript,MUI,swr,recoil,firebase
: 트위치 서드파티 프로덕트로 방송 중 실시간 퀴즈를 통해 시청자에게 문제를 출제하여 모두가 문제를 푸는 프로덕트 중 [문제 출제 웹사이트] 및 [관리자 상품 등록 웹사이트] 제작.
stomp.js를 통해 소켓 통신을 하여 문제를 관리.
기타 프로젝트 버전 업 및 마이그레이션
React 17→React 18withNext.js
redux→recoil→zustand
js→tsx
style-component→MUI→tailwindcss
- only
axios→axios+React-Queryorswr
- 배포 운영
- AWS, Varcel 를 통한 배포
- Google Analytics, hotjar를 통한 유저 분석
사내 문화 도입
: 회사의 문화가 정착되지 않아서 다양한 문화를 도입하였습니다.
- PR 문화 도입 : 회사에 PR의 필요성을 언급하고, 문화로 정착을 시켰습니다.
자기 PR: 스스로 Review 한 뒤에 타인에게 Review를 요청.선 병합 후 리뷰: 리뷰를 기다리다가 PR이 밀려 충돌에 취약해지는 문제가 발생. 선 머지 후 리뷰를 통해 이후 작업에서 리뷰의 내용을 적용하는 문화를 도입.칭찬 PR: 리팩토링을 하였거나 읽기 쉬운 변수명 등 내부 구성원의 화목을 위해 칭찬 PR을 도입.
- 기술 교육 : 주 1회 목요일마다 더 나은 개발자가 되기 위해 구성원 간 기술을 교육하는 시간을 가집니다. (이론 수업 및 라이브 코딩)
- 개발자 독서 모임 : 구성원들이 도서 지원비 활용을 장려하고자 독서 모임 주최하였습니다.
- 컨퍼런스 공유 및 참가
- AWSKRUG 프론트엔드 소모임
- AWS Submit 2023
- FE Conf 2023
- MongoDB.local Seoul 2023
토탈소프트뱅크
2020.07 ~ 2021.08 (1년 1개월)
: 해운, 항만, 물류 소프트웨어 회사에서 윈도우 프로그램, 모바일 웹뷰 등 제작.
- 회사의
Spring boot를 이용한 첫 프로젝트 투입
- 코드의 모듈화 진행 및 사용성 개선.
- 오류 log(20GB)를
python으로 정제하고 가공한 뒤 DB 업데이트 코드 제작.
- 네트워크 연결 시 프로그램을 실행시키는 batch 파일 제작.