항해 플러스 프론트엔드 1주차 회고

1. 이번 주 과제를 시작하며

지난 블로그 글 <퇴사 후 근황과 앞으로의 계획>에서 내가 '개발에 대한 기초지식이 모자라다'는 것을 느꼈고, 이를 보완하기 위한 일환으로 항해 플러스에 입과했다는 내용을 적었었다. 이번 글에서는 항해 1주차를 완료하고 난 회고를 작성해보려고 한다.

항해 플러스 프론트엔드는 10주간 4개의 챕터(프레임워크 없이 SPA 만들기, 클린 코드, 테스트 코드, 성능 최적화)를 진행하게 되는데, 첫 번째 챕터는 '프레임워크 없이 SPA 만들기'이다. 

거의 모든 사람들이 프레임워크를 사용해서 프론트엔드 개발을 하고 있다. 나 역시도 바닐라 자바스크립트로 개발을 한 것은 2022년 멋쟁이 사자처럼에서 처음 개발을 배웠던 1달 남짓 뿐이였고, 그 뒤로는 React, Vue, Svelte, 심지어 Phoenix까지 사용했지만 바닐라 자바스크립트만 사용하진 않았다.

하지만 기본을 잘 아는 사람이 응용도 잘하는 법이다. 이번 주차의 과제는 html과 tailwind css로 페이지가 구현되어 있는 거대한 하나의 Js파일이 주어졌고, 이를 기반으로 SPA를 구현하는 것이였다.

그렇기 때문에 이번 과제에서 내가 신경써야 할 부분은 두 가지였는데, 이는 다음과 같다.

1. 가능한 AI를 배제하면서 코딩해보기(개인적인 목표)
2. 프레임워크의 도움 없이 어플리케이션을 구현하며 바닐라 자바스크립트의 역량을 키우기(과제의 의도)

---

2. 과제를 마치고 나서 with KPT 회고

과제를 시작할 때의 나 / 과제 마지막날의 나

 

하지만 사실 이번 주 과제는 조졌다. 거대한 하나의 Js파일을 받은 나는 '이걸 어떻게 분할해야 예쁘게 재사용을 안하고 쓸 수 있을까?'를 먼저 고민했고, 심지어 AI를 쓰지 않기로 마음먹었으니 그걸 나누고 정리하는 것에만 많은 신경을 쏟았다.

그러다 보니 의욕이 떨어지고 과제에 손이 가지 않더라. Task도 따로 분리하지 않고 코드뭉치를 손으로 나누는 것에만 얽매여서 많은 시간을 날렸으니 당연한 것일지도 모른다.

결국 마지막에 제대로 이해도 못한 상태로 마구잡이로 AI를 사용해서 과제를 진행했고, 나에게는 씁쓸한 기분만이 남았다. 그래도 다음에는 같은 문제를 겪지 말아야하니 KPT 방식으로 회고를 작성해보자...

KPT 회고

Keep (유지하고 싶은 부분 / 좋았던 점 )

• 디자인 패턴들에 대해 실제로 경험하며 무엇인지 알게 된 것
  • 함수형 프로그래밍과 옵저버 패턴, 콜백 패턴 정도는 대충 인지하게 되었다.
  • 코드와 AI 명령 기록이 남아있으니 이를 토대로 추가 학습할 계획이다.
• 도메인별 폴더 구조를 시도해보고 한계를 직접 경험한 것
  • 사실 기존의 모놀리식 패턴에서 문제점을 느끼고 사용했던게 FSD 아키텍처였다.
  • 근데 FSD는 또 오버 엔지니어링이라는 생각이 있어서 이번에는 도메인을 중심으로 구조를 짜보았다.
  • 하지만 여러 페이지에서 특정 도메인에 종속되어 있는 코드가 재사용되는 경우를 전혀 고려하지 못했다는 생각이 들었다.

Problem (문제점 / 아쉬웠던 점)

• 과제의 목적을 놓친 것 
  • 코드뭉치를 나눠야 한다는 생각에 얽매여서 컴포넌트를 나누고 폴더구조 작성하는 것에만 집중했다.
  • 그 결과 과제에서 의도한 부분과는 다른 길로 나아가게 되었다.
• 태스크 관리 부재
  
  • 태스크를 적절히 나누지 않으면 시간 관리뿐만 아니라 일이 너무 덩어리로 뭉쳐있어 의욕이 떨어지더라..
• AI 활용의 극단적 사용
  • 초반에는 아예 사용하지 않아 시간만 쓰고 많이 하지도 못했고, 후반에는 시간이 없어 마구 사용해서 남는 게 없었다.
  • 사실 코치님들도 어느 정도 AI를 사용해서 개발할 것을 고려해서 과제의 난이도를 조절하시는데, 아예 AI를 사용하지 않는 것은 자만 아니였을까?
• 폴더 구조 설계의 한계
  • 화면 출력 도메인별로 폴더 구조를 작성했는데, 새로운 페이지가 추가되고 다른 도메인의 컴포넌트를 사용하는 경우를 고려하지 못했다.

Try (다음에 시도해볼 점)

• 다음 과제는 과제의 목적을 중심으로 접근하기
• 다시 과제 학습해보기
• 체계적 태스크 관리
  • 반드시 태스크를 나누고 일정을 관리하며 작업을 진행해 보자!
• 균형잡힌 AI 활용
  • 초반에는 아예 사용하지 않고, 후반에는 마구 사용하는 극단적 방식 대신 적절한 수준에서 AI를 활용하는 방법을 생각해보자.
• 좀 더 나은 폴더 구조 시도해보기
  • 확실히 모든것을 해결할 수 있는 방법은 없는 것 같다. 다음에는 조금 더 FSD에 가까운 방법으로 시도해보려고 한다.