1. 한 줄 요약"문법 개편이 아니라 엔진 교체!"7.0은 Go 언어 기반의 네이티브 컴파일러(Go-native Port)로 완전히 전환되면서 속도가 최대 10배 이상 빨라진 역사적인 패치입니다. 2. 핵심 변경사항 (Key Takeaways)① 빌드 & 타입 체크 속도 '최대 10배' 향상 (Native Compiler)기존 Node.js 기반 JS 컴파일러에서 Go 언어로 재작성된 네이티브 컴파일러로 바뀌었습니다.VS Code, 모노레포, 대형 프로젝트 기준으로 빌드/타입 체크 시간이 8~12배 이상 단축되었습니다.에디터(VS Code 등) 반응 속도(Hover 타입 추론, Autocomplete)가 매우 쾌적해졌습니다. ② 멀티스레드 병렬화 지원 (--checkers, --builders)병렬 처리..

🛡️ Error Boundary란?에러 바운더리는 자식 컴포넌트에서 발생한 에러를 잡아 UI를 대체 렌더링하는 컴포넌트이다.일반적으로 React에서 에러가 발생하면 전체 앱이 깨지면서 하얀 화면이 나오는데,Error Boundary를 사용하면 특정 영역만 fallback UI로 대체할 수 있다. ⚙️ 동작 방식에러 바운더리는 자식 컴포넌트에서 발생한 에러를 감지하여미리 정의한 UI를 렌더링한다. 에러 바운더리 구현을 위한 주요 메서드getDerivedStateFromError에러가 발생했을 때 호출상태를 변경하여 다음 렌더링에서 fallback UI를 보여줌componentDidCatch에러 정보를 로깅할 때 사용 🚀 구현에러 바운더리는 반드시 클래스 컴포넌트로 구현해야 한다.(함수형 컴포넌트로는 리..

역할 기반 구조에서 발생한 코드 탐색 문제를 해결하기 위해Feature 단위 구조(FSD 일부)를 도입한 경험을 정리한 글입니다. 📦 기존 프로젝트 구조이전 프로젝트에서는 역할 기반(hooks, utils, components)으로폴더를 분리하는 구조로 진행했었다.📦src ┣ 📂components ┣ 📂hooks ┣ 📂utils ┣ 📂types ┣ 📂lib...이전까지는 기초, 중급 프로젝트였기에 파일 수도 많지 않았고,역할 기반으로 나누는 방식이 직관적이고 익숙해서 팀원 모두 사용하고 있었다. 🤔 프로젝트를 진행하며 느낀 점개인 프로젝트나 팀 프로젝트를 여러번 경험해보면서역할 기반 구조에 불편함을 느끼기 시작했다. 하나의 기능을 수정하려고 할 때UI는 components 폴더에서 상태와 ..

프로젝트에서 폼 작성 도중 페이지를 벗어나는 상황을 막는 모달을 구현해야 했다.뒤로가기, 내부 링크 이동, 새로고침 등사용자가 의도치 않게 페이지를 떠나는 경우를 감지하고확인 모달을 띄워 이탈 여부를 확인해야 했다. 처음에는 단순하게 브라우저 히스토리를 사용하면 될 것이라고 생각했다.하지만 실제로 구현해보니 새로고침 + 뒤로가기 케이스에서 많은 예외 상황이 존재했다.이번 글은 그 과정을 간단하게 정리해보려고 한다. 1️⃣ 브라우저 히스토리를 가로채기처음에는 단순하게 뒤로가기를 막으면 된다는 생각으로 구현을 시작했다.폼에 진입할 때 히스토리를 하나 더 쌓아두고뒤로가기 이벤트(popstate)가 발생하면 가로채서 확인 모달을 띄우는 방식으로 구현했다.const handlePopState = () => { ..

로컬에서는 빠른데, Vercel에 배포한 뒤 API 응답 속도가 유독 느린 경우가 있다.이때 가장 먼저 확인해야 할 것이 바로 Function Region 설정이다.생각보다 이 설정 하나로 체감 속도가 크게 달라지기 때문에, 그 내용을 정리해보려고 한다. 🐢 배포 환경에서 API가 느렸던 상황배포한 사이트의 Network 탭을 확인해보면 다음과 같은 상황이었다.알림 API 응답 속도: 평균 400~500ms단순 fetch 요청임에도 상당한 지연 발생등록, 삭제 등의 다른 API도 전반적으로 응답 시간이 길었음서버 로직이 복잡하지 않음에도 불구하고 전체 API 응답 시간이 느리게 측정되었다.처음에는 BFF 구조로 한 번 더 서버를 거치기 때문에 느려지는 것인지 의심했었는데,원인은 다른 곳에 있었다. ⚙️..

GitHub에 학습 기록을 정리하는 분들을 보면서나도 공부한 내용을 GitHub에 남겨보고 싶다는 생각이 들었다. 들었던 강의나 읽었던 책의 내용을 README로 정리하는 방법도 떠올랐지만,조금 더 가독성 있고 나중에 다시 찾아보기 쉬운 형태로 정리하고 싶다는 고민이 있었다. 그러던 중 GitBook이라는 도구를 알게 되었고,GitBook으로 문서를 정리하면서 GitHub와 연동해기록을 남기는 방식이 좋아 보여서 두 도구를 함께 사용해보기로 했다. 그 과정을 간단하게 글로 남겨보려고 한다. 1. GitHub 레포지토리 생성먼저 GitBook과 연동할 GitHub 레포지토리를 생성했다. 2. GitBook Space 생성GitHub 레포지토리를 생성하고실제 문서를 작성할 GitBook Space를 생성했다..