Project 5

[React+Vite+TypeScript] try-catch! 이미지/오디오/폰트 최적화 및 vite 번들 최적화

안녕하세요! 지난번 최적화 과정 (https://devbyzero.tistory.com/22)글을 쓰고 재빠르게 2탄으로 돌아왔습니다.. [React+Vite+TypeScript] try-catch! Vitest + RTL 최적화이번에도 돌아온 프로젝트의 마무리 시간.최적화 타임!지난번 프로젝트에서는 Lighthouse로 최적화를 진행해보았다면,이번에는 그 전단계에서 진행하는 최적화 과정을 가져볼까 합니다.요 방법은devbyzero.tistory.com 최적화란 끝도 없으며,, 하기 나름이기도 하지만이번 프로젝트는 지금 상황에서 할 수 있는 만큼 해보려고 합니다.무엇보다 개발하면서 늘 이미지와 오디오 파일이 큰 것이 신경이 쓰였기 때문에최적화로 줄여버리고 싶은 마음이 컸고..귀찮음을 꾹 참고 해보겠습니..

Project 2026.02.16

[React+Vite+TypeScript] try-catch! Vitest + RTL 최적화

이번에도 돌아온 프로젝트의 마무리 시간.최적화 타임!지난번 프로젝트에서는 Lighthouse로 최적화를 진행해보았다면,이번에는 그 전단계에서 진행하는 최적화 과정을 가져볼까 합니다.요 방법은 제가 채용 공고들을 보다가 알게 되었으며..처음 도전해보는 것이기 때문에 헤맬 수 있음에 유의하시고..그럼 들어가겄습니다. 저는 이번 프로젝트에서 프론트엔드를 맡았고, 제가 맡은 페이지들이 꽤 많았습니다.프론트엔드 전체 공통 UI 레이아웃부터 게임화면에 들어가기까지의 페이지를 제가 맡았거든요.아 그래서 제가 혼자서 많은걸 했다는 건가요? >> 전혀 아닙니다. 게임화면 페이지 구현, 채점 결과 페이지 구현 등 다른 페이지도정말 만만치 않았기 때문에 팀원들 모두 고생하며 개발했지요..아무튼 이렇게 프로젝트가 어떻게 완성..

Project 2026.02.13

[Jenkins][React+TypeScript] eslint가 배포 빌드에 영향을 미치는 점..

프론트엔드 개발환경 세팅할때 다들 자동설정되는 eslint 파일.. 아시죠..?현재 제가 하고 있는 프로젝트는 Jenkins로 배포가 되어 있는 상황이라 브랜치로 push 하면 바로 빌드가 되어 배포 사이트에서 확인이 가능한데요,, 오늘 글은 제가 한 eslint 설정과 이것이 배포환경에 미치는 영향을 알아보도록 하겠습니다.. 우선 저는 eslint.config.js 파일을 다음과 같이 작성했습니다import js from '@eslint/js';import globals from 'globals';import reactHooks from 'eslint-plugin-react-hooks';import reactRefresh from 'eslint-plugin-react-refresh';import tse..

Project 2026.01.27

[Vue.js] 프론트엔드 프로젝트 성능 측정 01 - 💡Lighthouse

성능 측정을 진행하며 작성한 기록용 글입니다.정보 요약은 게시글 하단에서 확인 가능합니다. 안녕하세용!하나의 프로젝트가 끝나면 해야할 것이 있습니다..바로바로...성능 측정!저는 지난 프로젝트에서 프론트엔드를 맡아서 했기 때문에 프론트엔드 성능 측정을 진행해보겠습니다.지난 프로젝트에 대한 간단한 설명글은 - 프로젝트 명세서 및 주" data-og-description="안녕하세요!제가 Django + Vue.js 로 AI API 기반 도서 추천 및 실시간 모임(채팅) 서비스 앱을 개발하였습니다..일단 메인 페이지부터.. 개발 기간은 2025.12.19 ~ 2025.12.26까지 총 일주일로 진행이 되었는" data-og-host="devbyzero.tistory.com" data-og-source-url..

Project 2026.01.05

[Django + Vue.js] 1. AI API 기반 도서 추천 및 실시간 모임 서비스 앱 <BOOKLUV> - 프로젝트 명세서 및 주요 서비스 설명

안녕하세요!제가 Django + Vue.js 로 AI API 기반 도서 추천 및 실시간 모임(채팅) 서비스 앱을 개발하였습니다..일단 메인 페이지부터.. 개발 기간은 2025.12.19 ~ 2025.12.26까지 총 일주일로 진행이 되었는데, (물론 이 글을 작성하는 오늘까지 에러 및 미흡한 구현을 수정하였습니다.. 고치려고 한다면 끝도 없음 ^^)짧은 기간이었지만 처음으로 나름의 성과를 만들어낸 플젝이라 생각하여 글로 기록합니다. 잔말 말고 바로 들어가기에 앞서.. 프로젝트 기획 배경 짧게 설명같이 수업듣는 친구들끼리 교환독서(책 한권으로 서로 나눠 읽으면서 책에 간단한 메모 남기며 읽고 교류하는 독서)를 하게 되었는데, 독서 모임을 좀 더 가볍고 쉽게 가질 수 없을까? 란 생각이 들었습니다.오프라인에..

Project 2026.01.02