반응형 프론트엔드실전2 React Router로 웹페이지 이동 흐름 완전 정복｜SPA 라우팅 구현 모든 방법 🚀 React Router로 웹페이지 이동 흐름 완전 정복｜SPA에서 라우팅을 구현하는 모든 방법안녕하세요, 퍼블리셔 노미입니다!지금까지 우리는 HTML, CSS, JavaScript, API, 인증, 상태관리, 모달까지 프론트엔드 개발의 핵심 흐름을 따라왔습니다.하지만 여기서 한 가지 빠질 수 없는 주제가 있어요.바로 **“라우팅(Routing)”** 입니다.SPA(Single Page Application)에서는 화면 이동을 어떻게 구현할까요?새로고침 없이 자연스럽게 페이지를 이동하려면 어떤 기술이 필요할까요?이 글에서는 프론트 개발자가 꼭 알아야 할 SPA와 라우팅 개념부터 React Router 사용법, 실전 코드 구성까지 자세하게 풀어서 정리해드릴게요.📌 라우팅(Routing)이란?라우팅이란.. 2025. 5. 4. React에서 모달 시스템 제대로 설계하기｜Context 전역 관리부터 Portal까지 실전 구현 🪟 React에서 모달(Dialog) 시스템 제대로 설계하기｜Context로 상태 관리부터 포탈 구현까지안녕하세요, 퍼블리셔 노미입니다!웹에서 흔히 볼 수 있는 UI 중 하나인 모달 창(Modal Dialog)은 사용자에게 알림을 주거나, 확인을 받거나, 추가 정보를 보여주는 데 자주 사용됩니다.React에서 모달을 구현할 땐 단순히 `display: block`으로 보여주는 것을 넘어서 Context로 전역 관리하거나, React Portal로 구조를 분리하거나, 다중 모달 & 접근성까지 고려해야 할 부분이 많아요.오늘은 그런 모달 시스템을 기초부터 실전 패턴까지 정리해드릴게요.📌 모달이란?모달(Modal)은 현재 UI 흐름을 중단하고, 사용자에게 특정 작업을 유도하는 오버레이 창입니다.주로 배경을.. 2025. 4. 28. 이전 1 다음 반응형
