
React Query의 Client 기능을 사용해 데이터 캐싱으로 서버 리소스 절약
>>
1. ReactQuery를 활용해서 백엔드 부하를 5% 줄였습니다.
2. GET /lists API 는 자주 바뀌는 데이터가 아닙니다. 그래서 gcTime staleTime 을 2m 로 설정했습니다.
3. 기존에 10번이 날아가는 콜이 1번으로 변경되었습니다.
4. 백엔드 Fargate의 Metrics를 확인해서 CPU Memory 사용량이 5% 감소함을 확인했습니다.
5. Fargate가 0.5 vCPU 에서 0.25 vCPU 로 줄여서 비용도 40% 감소할 수 있었습니다.
Cypress를 활용한 E2E 테스트 코드 작성법 습득 및 적용
>>
Cypress 를 통해서 다음과 같은 테스트를 적용하고 확인했다.
1. login form 에서 id/pw를 입력시 에러 데이터가 입력시 에러메시지 토스트가 나오는지 체크
2. Login 성공시 redirect로 /dashboard 페이지로 이동후 스크린샷 저장해서 확인
3. CI / CD 과정에 통합했다.
SEO를 위한 사이트 구조 개선 및 사이트맵 구성
>>
SEO 구글 봇이 크롤링해서 데이터를 가져온다 robots.txt sitemap.xml
페이지 로딩속도 가 가장 중요하다
>>
기존의 SSR페이지 로딩속도가 700ms 정도로 느린 편이다.
SSR은 nextjs 에서 serverless 를 활용하기에 cold start 때문에 느리다.
그래서 SSG는 CDN을 활용하기 때문에 전세계에서 비슷한 속도를 가진다.
기존에 SSR 페이지를 주기적 가져오는 ISR형태로 revalidate time 5m 전환시켰다.
5분 간격으로 데이터가 변하는 것으로 REST API 대응을 완료했다.
기존 700ms -> 100ms 정도로 페이지의 로딩속도가 개선되었다.
google search console 에서도 성능 문제가 있던 페이지의 오류가 해결되었다.
취업난 속에서 경제적 어려움까지 겪는 취준생 여러분의 고충을 깊이 공감합니다. 그래서 부담 없이 배우실 수 있도록 저렴한 가격으로 이 강의를 준비했습니다. 이 강의는 프론트엔드 개발 취업을 목표로 하는 모든 분들을 위해, 단 한 부분이라도 얻어갈 수 있도록 핵심 내용을 담았습니다.
이력서 작성의 막막함, 어디서부터 시작해야 할지 모르는 답답함을 해소해 드리고자, 프론트엔드 개발 직무에 특화된 이력서 작성 전략을 명확하게 제시합니다. 기술 스택 나열부터 프로젝트 설명, 포트폴리오 강조까지, 채용 담당자의 시각에서 돋보이는 이력서 작성 노하우를 아낌없이 공유합니다.
이 강의를 통해 이력서의 단 한 줄이라도 더 효과적으로 작성할 수 있게 된다면, 그것만으로도 여러분의 취업 활동에 큰 도움이 될 것이라고 믿습니다. 이 강의가 여러분의 꿈을 이루는 데 조금이나마 보탬이 되기를 진심으로 바라며, 여러분의 성공적인 취업을 응원합니다. 어려운 시기에도 꿈을 향해 나아가는 여러분을 진심으로 응원합니다.