[항해 플러스 프론트엔드 5기] 9주차 회고

이번 주차는 특별하게 과제를 진행했던 레포지토리를 첨부해본다.
👉 내 레포지토리 바로가기

이 안에는 용어 개념 정리도 해놓았고, 회고글도 작성해두었기 때문이다.

 

이번 주차 목표 (인프라 관점의 성능 최적화)

(1) 프론트엔드 프로젝트 배포 프로세스를 이해한다.

(2) 인프라 레벨 최적화 개념을 이해한다.

(3) CDN 및 캐싱 전략을 수립할 수 있다.

 

1. 고민했던 문제

- 다이어그램 툴 선택
배포 파이프라인을 다이어그램으로 표현해야 했는데, 뭘로 그릴지 고민했다.
처음에는 diagrams를 썼는데, 뭔가 허전하게 느껴졌다.

뭔가 비루하지만 소중한 나의 다이어그램. AWS 리소스 간의 관계를 제대로 표현 안 한 게 다시 그리게 된 계기...

 

- S3와 CloudFront의 CDN 측정
S3와 CloudFront를 사용했을 때의 효과를 비교하려고 했는데, 처음에는 캐싱 상태로 측정하다 보니 결과가 잘 안 나왔다.
과제 제출 전에 다시 검토해보니, 이전과 이후를 비교하기에는 캐싱 때문에 정확한 측정이 어려울 것 같았다.
그래서 캐시를 강제로 풀고 나서 재측정하느라 꽤 고생을 했다.
물론… 결과를 캡처하고 표로 정리하는 것 정도였지만, 그래도 AI의 도움을 받아 조금 더 수월하게 할 수 있었다.

 

2. 시도 및 해결

- 다이어그램 뭐로 그리지라는 고민을 해서 멘토링 질문을 올렸는데 답변해주셨다.

1. excalidraw
2. Markdown 기반으로 한다면, mermaid 추천합니다!
3. ai한테 svg로 만들어줘! 라고 해도 잘 만들어주더라...

마크다운 기반으로는 mermaid가 좋다고 해서 README.md에 mermaid로 시도했다. 플로우차트와 시퀀스 다이어그램까지 추가했더니, 시각적으로 정리도 잘되고 만족스러웠다. 정말 아름다워... mermaid는 첨부가 안 되서 넣을 순 없었는데, 위에 레포지토리 가면 볼 수 있다.

 

 

3. 개선해야 할 것

배포 빼고는 내 일이 아니라고 생각했는데, 이번 기회에 네트워크나 인프라 쪽도 함께 공부해야겠다는 생각이 들었다.
Docker 이미지 기반에서 GitHub Actions로 배포를 전환해본 경험은 있지만, CI/CD나 Nginx 말고 그 외의 인프라 분야는 여전히 약하다고 느낀다.
프론트엔드로만 머무를 수는 없을 것 같고, 앞으로 30년을 개발할 생각이니 이런 영역도 꾸준히 공부해야겠다.

 

 

4. 알게된 것

- 이번 기회에 Route 53도 처음 알았다. 완전히 생소한 서비스였는데, 실무에서는 도메인 등록 → S3/CloudFront와 연결 → HTTPS 인증서 발급까지 진행하는 경우가 많다고 한다.

- 이전까지는 “그냥 해야 하니까”로 했던 것들을, 이제는 “왜 이렇게 하지?”를 스스로 질문하고 정리하게 되었다.

- 배포 파이프라인을 다 그려놓고 카나리 배포 적용 아티클을 읽었다. 실무에서 이런 네트워크 지식이 어떻게 쓰이는지를 참고하라는 링크도 첨부돼 있었는데, 막상 읽어보니 모르는 용어가 정말 산더미처럼 쏟아졌다.

그래도 그걸 하나씩 정리해보면서, 앞으로 비슷한 상황을 마주할 때 어떤 개념을 더 공부해야 할지 방향을 잡을 수 있었다.
“이런 개념들, 다들 어떻게 공부하시나요?”도 여쭤봤는데, 답변으로는 AI에게 먼저 질문해보고 → 공식문서나 구글링으로 아티클 접하기 → 다시 AI에게 물어보며 개념을 정리 → 실제로 직접 구축해보기의 순서를 추천받았다. 꼭 해봐야지...

다 아는줄 알았는데 그저 말하는 감자였어...

 

 

---

Keep

• 현재의 흐름과 과정을 만족하며 계속 유지할 것
• “용두사미 금지, 용두용미로 가자!”

Problem

• 다음주가 지나면 “끝”이니깐 공부습관이 흐트러질까봐 걱정된다.
• 하지만 끝난다고 해서 내 인생이 끝난 건 아니니까… 계속 가야 한다.

Try

• 그래도 공부할 건 산더미니깐…
• 계속 공부하자. 시작 전보다 알게 된 건 훨씬 많아졌지만, 모르는 건 어떻게 더 늘어난 것 같은 묘한 기분이다.
• 그래도 지금까지 잘해왔으니, 앞으로도 계속 믿고 가자.