rohnotes

2024년 4월 부터 2025년 2월까지 카운터컬쳐컴퍼니에서 근무하며,

댄스보컬 온라인교육 사이트를 개발하였다.

백엔드는 strapi 와 rdb 로 구성되었고,

나는 프론트엔드를 담당하여, react, nextjs 로 개발하였다.

내가 직접 개발하진 않았지만 strapi 의 생산성을 다시 한 번 느낄 수 있었고,

프론트엔드 부분은 이전 프로젝트에서 보다 디테일한 부분을 더 보완하여 개발하였다.

가자 큰 원칙으로는 한 파일당 200 줄이 넘어가지 않도록, 한 commit 당 50 줄이 넘어가지 않도록 노력하며 개발을 하였다.

atomic 디자인을 통해 atoms, molecules, organisms, templates, pages 단계로 뷰 컴포넌트를 관리했는데,

atoms 는 스타일과 props 만 담고 있고,

molecules 는 atoms 의 조합,

organisms 는 가장 지저분한 단계일 수 있지만, 간단히 각 templates 에서만 사용되는 뷰와 상태가 포함된 컴포넌트,

templates 는 page 별로 하나씩 존재하며, organisms 의 조합이며 뷰와 상태가 포함된 컴포넌트,

pages 는 데이터와 template 을 매핑 시키는 단계, server state 나 브라우저 상태를 관리하는 컴포넌트.

이렇게 구분하면 될 것 같은데, 실제로는 templates 에서 server state 를 많이 사용한 것 같다.

local state 는 useState 로, gloabl state 는 zustand 로, server state 는 react-query 로 관리하였다.

페이지별 custom hook 으로 local state 를 관리하여,

store 라는 디렉토리로 global state 를 관리하고,

root custom hook 으로 server state 를 관리했는데,

다음에는 하나의 hooks 디렉토리로 local, global, server state 를 구분하여 사용하여도 좋을 것 같다!

이번에는 zod 라는 라이브러리를 활용하여 api response 로 받은 데이터를 zod 로 타입을 체크하여, 백엔드 데이터가 달라지거나 null 이나 undefined 로 들어오면 error 가 뜨도록 의도하여 개발하니, 뭔가 타이트하게 체크하는 느낌이 들어서 좋았다.

프로젝트 막바지에는 새로오신 개발자분이 typescript class 를 활용을 잘해주셔서 class 도 조금 활용해볼 수 있었는데,

다음 프로젝ㅌ에서는 state 와 zod 로 관리했던 내용을 class 를 활용하여 개발해보고 싶다!

2023년 10월부터 2024년 4월까지 6개월 동안 채권관리프로그램 개발 프로젝트에 참여하였다.

DB 는 postgresql,

백엔드는 java, spring

프론트엔드는 react, nextjs 로 구성돼어 풀스택 개발을 하였다.

기존 프로그램을 마이그레이션 하는 프로젝트였는데,

기존 DB 의 구조를 이해하는데 어려움이 있었고,

앞으로 내가 더 공부하고 익숙해져야 하는 부분임을 알게 되었다.

백엔드는 워낙 잘하시는 분이 구조를 잡아주어 큰 어려움 없이 디테일한 부분을 학습해가며 개발할 수 있었고,

프론트엔드는 react query 로 server state 를 관리하는 게 마음에 들었고,

global state 는 recoil 로 관리하여, 나름 디테일한 스킬을 보완할 수 있었던 프로젝트였다.

2022년 8월 경 주식회사 틴틴 이라는 법인을 만들고, 사업자 등록까지 하였다.

핵심 이해관계자 2명과 함께 진행하였고 사이트 개발까지 되었으나,

영업, 마케팅, 운영부분에 힘쓰지 못하여,

결국 2023년 11월 6일 부로 핵심 이해관계자 1명에게 법인 대표자를 넘기고,

주식 전량을 양도하고 마무리하였다.

나는 어떤 일을 하더라도 주인의식을 가지고 하는 성격인데,

이번일을 통해서 내가 주체적으로 시작한 일이 아니라면,

경제적인 보상이 따라줘야 내가 제대로 일할 수 있는 사람이구나 라는 것을 알게되었다.

이 경험을 바탕으로 앞으로는 좀 더 확실한 기준으로 일하는 사람이 되려고 한다.

키움증권에서 제공하는 시그널메이커 스크립트를 활용하여 해외선물 자동매매 프로그램을 개발하였다.

충분한 증거금과 원칙적인 매매를 할 수 있다면 리스크는 있지만 수익을 만들어낼 수 있는 방법 중 하나이다.

11주 동안 64번의 커밋으로 위니아에이드 자급제 보상서비스 관리 시스템을 개발하였다.

크게 java springboot 와 oracle db 를 활용하였고, 현재 운영 중인 시스템이다.

파트너사에서 윈도우 애플리케이션 제작요청이 들어와서

electron 을 활용하여 11주 동안 14번 커밋을 통해 개발하였다.

파트너사에서 인도개발자들에게 외주로 맡겨 개발한 php 사이트를 넘겨받아서,

php 버전을 업데이트 해주고,

vapor 를 활용하여 staging 환경과 production 환경을 구분하여 aws 에 배포해주었다.

작업은 2주에 걸쳐 6일동안 진행되었다.

 스타트업 캠핏에서 5개월 정도 프론트엔드 개발을 하였다.

 작은 규모의 회사임에도 굉장히 개발업무 프로세스와 프로덕트 디테일이 잘 갖추어져 있어서 좋았다.

 이전까지는 프론트엔드, 백엔드, 인프라 모든 분야 업무를 해왔었는데, 캠핏에서는 프론트엔드 업무만 하니 좋은 점도 있었고, 아쉬운 점도 있었다.

 그리고 업무를 하던 중 나는 백엔드나 풀스택 개발자를 하고 싶어한다는 걸 개발을 해온 지 6년만에 깨달았다.

 많은 걸 배울 수 있었던 소중한 경험을 안겨준 캠핏에 감사하고 새로 진행하는 일들을 더 잘 해내고 싶다.

 2021년 3월부터 2022년 2월까지 1년간 스타트업 수공에서 웹사이트와 앱을 개발하였다.

 처음 수공으로 갔을 때 웹사이트와 어드민은 개발되어 운영중이었고, 마스터(수리 기사님들)용 안드로이드앱은 개발 중이었다. 이 당시 아키텍쳐는 프론트엔드는 react 로 되어 있었고, 백엔드는 ruby, 인프라는 aws ec2 등으로 구성되어 있었다. 내가 입사한 이후 기존 개발자 분들 4분이 모두 다 퇴사하시고, 훌륭한 분들이 입사하셔서 내가 퇴사할 때는 개발팀이 6명까지 되었다.

 마스터용 안드로이드앱은 한 개발자분이 담당하셔서 나는 개발환경까지만 세팅하고 개발에 기여한 부분이 없었다.

 기존 개발자분들이 퇴사하시고, 안드로이드 개발자 한 분과 프론트엔드 개발자 한 분이 있었는데, 이 때 나는 내가 백엔드 이외에 다른 모든 개발내용을 알아야겠다고 판단하고, 백엔드에 집중하기 보다는 생산성을 높이기 위해 최근 프로젝트에서 활용했던 amplify 를 이용해 개발해보려 했으나 한 달이라는 시간내에 react-admin 과 카테고리 관리 기능 등의 기본적인 세팅까지만 마치고 amplify 를 이용한 개발은 멈춰야 했다.

 이후 백엔드 개발자 한 분이 오셔서 java springboot 로 기존 database 를 활용하는 방법으로 새롭게 개발을 시작하였다. 이 때 나는 springboot 를 aws lambda 로 배포하는 것을 테스트해보고, 이후 ecs 를 활용하여 개발, 테스트, 메인 서버를 구성하였다.

 그리고 프론트엔드는 aws amplify 를 통해 nextjs 를 배포하니 버지니아에 배포되어 서버가 느린 현상이 발견되어, serverless 를 활용하여 aws lambda@edge 로 배포하여 프론트엔드 서버 속도를 향상 시켰다. 웹사이트 메인서버 릴리즈 직전에는 카카오, 네이버 등 SNS 로그인을 연계하여 문의가 접수되는 프로세스를 개발하였다.

 이렇게 개발되어가는 중 백엔드 개발자 한 분이 오셔서 어드민 프론트엔드와 백엔드를 개발하셨는데, 이때 해당 개발자 분이 백엔드를 희망하는 것을 확인하고 내가 어드민 프론트엔드를 맡겠다고 했고, 어드민 프론트엔드를 일부 작업하다가 웹사이트 프론트엔드 작업이 많아져서 다시 웹사이트 프론트엔드 작업을 하였다. 그리고 웹 백엔드 작업도 일부 참여하였다.

 웹백엔드에서 어드민 백엔드 서버 분리가 필요하다고 하여 어드민 백엔드는 ec2 와 로드밸런서 등을 활용하여 구성하였고, ecs 배포 시간이 오래걸려서 웹 백엔드 개발서버도 ecs 에서 ec2 로 변경하였다.

 이렇게 백엔드와 프론트엔드의 인프라 부분을 작업하면서 github action 을 활용하여 CI/CD 도 세팅하였다.

 그리고 프론트엔드 개발자 한 분이 더 채용되셔서 개발자 6명이 팀이 되었고, 나는 리액트네이티브 웹뷰를 활용하여 안드로이드 앱과 iOS 앱을 배포하였다. 리액트네이티브 앱은 외주업체에서 2주간 작업하여 넘겨준 소스코드가 있었는데, 앱 웹뷰와 웹사이트가 통신하는 것과 카카오, 애플로그인이 자연스럽게 이루어지도록 웹사이트 프론트엔드 작업과 일부 백엔드 작업도 하였다.

 내가 수공에서 일하며 가장 중요하게 생각했던 것은 인프라, 소스코드에 대한 권한을 모두다 공유하고 이상적인 개발환경에서 일하는 것이었다. 이 부분에 대해서는 잘 이루어져서 좋은 팀을 이루고 떠나게 되어 기쁘다. 단 한 가지 아쉬운 점은 이런 상황에서 내 포지션을 명확히 하지 못했다는 것이다. 왜 프론트엔드와 백엔드를 구분해야 하는가? 에 대한 여러 이유 중 한 가지를 배울 수 있던 시간이었다.

어제 깃헙을 구경하는데 github > explorer > collections 에 아래와 같이 made in india 페이지가 있는 것을 확인했다.

https://github.com/collections/made-in-india

왜 made in korea 는 없을까 생각하고 github/explore 프로젝트를 살펴보니, collections 에 made in korea 를 추가할 수 있다는 걸 알게 되었다.

바로 행정안전부 사이트에서 태극기 이미지를 받고, 마크다운 문서를 하나 작성해서 github/explore 프로젝트에 풀리퀘스트를 하였고, 몇시간 후 머지가 되어서 아래와 같이 made in korea 페이지가 만들어졌다.

정말 간단한 작업이었지만 개발자라면 모를 수 없고, MS 에서 8조원에 인수한 github 프로젝트에 작게나마 기여했다는 게 뿌듯해서 기록한다.

https://github.com/collections/made-in-korea