코딩일기/항해997 포크가 뭐야? 항해 과제 시작하는 법 다들 과제 시작하셨나요? 처음으로 과제를 시작하려니까 막막할거예요.저는 포크를 항해에서 처음 떠 봤어요. 지금 회사에서는 이렇게 버전 관리를 하지는 않았거든요.말은 안해도 저 같은 사람이 분명 있을 것 같아서, 속터졌던 저처럼 되지 말라고 과제 시작하는 법을 알려드릴게요!발제 자료를 가볍게 훑어보기읽어봐야 할 자료가 너무 많이 쏟아지니까 정신없죠?과제 전에 이 많은 자료를 정독한다고 생각하면 시작도 하기 힘들어요.그렇다고 안 읽고 시작하면 빠르게 진행할 수 있는 힌트를 놓칠 수 있답니다. 과제 포크뜨기 진행할 과제를 포크 뜨고 시작해요. 과제 안내 페이지의 상단에 첨부된 깃 링크로 이동하세요 포크 버튼 클릭 -> create a new fork 자동완성된 내용이 있을텐데, 따로 변경하지 않아도 괜.. 2025. 3. 23. 몸도 마음도 건강하게 수료했어요 항해99 플러스 프론트엔드반 수료 후 작성하는 후기수료식때 회고 발표했던 내용인데 기억해두고 싶어서 정리한다. "> 드디어 진행 바가 다 채워졌습니다.일수로는 78일, 주차로는 11주였는데너무 멀어서 오지 않을 것 같던 수료일이 되니기분이 묘합니다. 트러블 슈팅 경험을 얘기해보자면,제 트러블은 코드나 잘 해결되지 않던 버그가 아니었습니다.주차 후기글로 작성했던 블로그 글을 캡쳐해봤는데,원하는 만큼의 실력이 나오지 않아서 괴로웠던 그때의 마음이 기억납니다.비슷한 연차인 것 같은데 다들 과제를 쑥 해버리는 모습을 보고난 왜 못하지.. 라는 자책과내가 못하는 이유를 어떻게든 만들어서 스스로 위로하기를 동시에 했었습니다. 이 트러블을 "슈팅"했던 이유는 생각지도 못하게 사람들 덕분이었습니다.메타버스에 .. 2025. 3. 3. FE -CDN 도입 성능 보고서 준비CDN도입 전 : S3CDN도입 후 : CloudFront 측정 환경 세팅측정 환경 : 동일한 PC / 윈도우 / Chrome측정 도구 : Chrome 개발자 도구 - Network, Performance, Lighthouse 기대 효과TTFB 감소: 요청이 지역 엣지 서버로 라우팅.대역폭 최적화: 압축 및 캐싱으로 전송 비용 감소.성능 일관성: 사용자 위치에 따른 성능 차이 감소. #성능 측정Queueing (대기열)요청이 브라우저의 네트워크 큐에 대기한 시간 Stalled (중단됨)요청이 실행되기 전 네트워크 자원 확보를 기다린 시간저하 원인 분석 & 개선DNS 조회 및 TCP 연결 증가 → AWS CloudFront에서 Keep-Alive 설정 _ 하려고 했으나 CloudFront는 원칙적으로 .. 2025. 2. 22. FE 배포 파이프라인 구축(CI/CD) 프론트엔드 배포 CI/CD 파이프라인 구축하기 🤷♂️ 목적변경된 코드를 GitHub에 올리면 자동으로 지정된 아래 작업을 완료하고 배포하도록 만듦📦 구축된 CI/CD 의 빌드 과정Checkout 액션을 사용해 코드 내려받기 → GitHub Actions에서 제공하는 actions/checkout을 사용해 최신 코드를 가져옴의존성 설치npm ci 명령어로 프로젝트 의존성 설치 (npm install보다 빠르고 일관적)Next.js프로젝트 빌드npm run buildAWS 자격 증명 구성GitHub Actions에 저장된 계정 인증 정보를 사용해 구성빌드된 파일을 S3 버킷에 동기화AWS CLI 명령어를 사용하여 빌드된 정적 파일을 S3 버킷에 업로드.CloudFront 캐시 무효화최신 컨텐츠로 갱신 .. 2025. 2. 22. FE 성능최적화 일대기 야! 너두 수치화된 기술경험 가질 수 있어~! 가입이 제일 어려운 AWS분명 구글 계정에 연동된 계정이 있는건 알겠는데.. 어딘가에 적어둔 비밀번호도 찾았는데 12자리 verify 키는 뭔가요. 그리고 왜 나는 내 비밀번호를 찾을 수 없나요…!결국 네이버 계정으로 새로 가입하기로 마음먹었지만 신용카드 연결부터 한세월.가입을 완료하고 S3 - 버킷으로 진입 중간과정은 생략하고 일단 next.js 업로드 성공! CDN 추가. CDN을 이용한 부분이 훨씬 빠르고 압축되어서 배포되는 모습 확인 IAM 작업중. 나에게 IAM은 아이브 뿐인데.여기서 내 예측이 그대로 들어맞았다. 내 버킷 이름을 입력해야 하는데 zenna bucket으로 설정한것까지도 기억하면서 zenna-bucket인지 zennaBucket인.. 2025. 2. 22. [WIL] 돌고 돌아 원점으로! 이번 주 주제 : 클린코드와 리팩토링 정규모임 출석QnA세션 듣기멘토링기본과제심화과제전주 과제피드백 확인OO테오△△O 처음으로 심화를 시도해보긴 했지만 심화도 기본도 아쉬웠던 한 주.뜯고 붙이고 뜯고 붙이고 정말 시간을 많이 투자했는데결론만 놓고 보자면 바뀐게 별로 없는 리팩토링이었다. 결과만 본 사람들은 얘가 도대체 뭘 했다는 건지 의문이지 않았을까? 우리회사 코드를 보다 보면, 어떻게 해야 좋은지는 모르겠지만"하여튼 이건 좀 아니다..." 싶은 부분이 정말 많았다. "A상태 변경"이라는 이름을 가진 메서드 안에전혀 엉뚱한 요청 API가 껴 있기도 하고 (그리고 그 요청은 높은 확률로 DB를 변경시켰다.)이 함수를 처음에 어떤 용도로 만들었지만결국 어떻게 괴랄해졌는지 역사를 알 수 있는 네이밍까지.... 2025. 1. 12. WIL : 첫 재귀는 너무 어려워 정규모임 출석QnA세션 듣기멘토링기본과제심화과제전주 과제피드백 확인OX1/3OXO 코딩도 일기를 쓰면 도움이 된다고 해서 써보는 WIL. 그렇지만 과제가 다 끝나면 분명 기억이 안날테니까 과제 중에 채워나가는 중. createVNode를 잘 베끼고 normalizeVNode를 시작하면서 고뇌가 시작됐다. 재귀를 처음 해봤는데, 인셉션같은 구조라 너무 어려웠다. vNode를 만드는데, 그 vNode가 사실 다른 vNode를 만드는 함수일 수 있대. 그래서 그 함수를 불러서 vNode를 만들어 바깥으로 꺼내줘야 하는데 내 createVNode는 object를 인자로 받지 않았지만 그 함수는 인자를 object로 해줘야 한대..!!!미칠 것 같은 디버깅의 시간이었다. 챗 지피티를 얼마나 괴롭혔는지 모르겠다.고.. 2024. 12. 26. 이전 1 다음 728x90 반응형
