# Route
[TIL] Day-16
history API를 배우면서 SPA의 작동 방식을 알게되었다.SPA는 Single Page Applction이라는 뜻인데서버에서는 index.html만 처음 내려받고 index.html에 요소들만 다시 그려주는 방식이다. 즉, url을 보고 어떤 페이지를 그릴 건지
[React] 라우터 이해하기(Route, Link, Switch)
라우터는 path 속성으로 자신이 원하는 URL 주소를 만들고 그 해당 URL에 들어갈 컴포넌트들을 지정할 수 있습니다. 또한, 브라우저 이동 없이 컴포넌트만 전환하여 마치 모바일 앱처럼 이루어지게끔 해줍니다.URL과 UI를 동기화해주는 라우터이며, 웹 어플리케이션이
React 동적 라우팅
SPA웹은 라우팅이 필수 적입니다 리액트의 경우 Facebook에서 라우팅에 대한 공식 라이브러리를 제공하지 않기 때문에 서드파티 라이브러리인react-route-dom을 사용하여 라우팅을 합니다.리액트 역시 처음에는 정적 라우팅을 사용했지만 정적 라우팅의 제한적인
[React] 리액트 라우터로 SPA 개발하기
본 글은 [리액트를 다루는 기술] 13장을 참고하여 포스팅하였습니다. SPA, Route 컴포넌트, Link 컴포넌트, Link 컴포넌트, URL 파라미터, URL쿼리, 서브 라우트, 라우터 부가기능에 대해 정리하였습니다.
React 라우터, 접근 제한 Private Route
SPA와 React Router란? > * SPA란? > Single Page Application (싱글 페이지 어플리케이션) 의 약자입니다. 말 그대로, 페이지가 1개인 어플리케이션이란 뜻입니다. > 기존 전통적인 웹어플리케이션의 구조는 여러 페이지로 구성되어있습
[웹] Node.js & React 회원관리 - 5
Client는 React로 작업을 할 것이므로 React를 설치한다폴더구성은 이렇게 server/client를 구분해주고터미널에 cd client로 client 폴더로 이동하여 client 개발을 한다npx create-react-app .위 명령어로 설치하면 기본적으
[react] 노마드코더 영화웹서비스 제작 6.3 Sharing Props between Routes
모든 컴포넌트에는 props가 있다. Movie.js처럼 About.js에도 props가 있는데,콘솔을 보면 4 개의 props가 보인다. history, location, match, staticContext. 이것들은 아직 About.js로 전송된 것은 아니고,
[express] 기본 라우팅 / express.Router
라우팅?? > 클라이언트의 특정 요청 method와 엔드포인트에 따라 에 따라 다른 응답 처리 하는 것을 의미한다. express에서만이 아니라 node에서도 라우트 별로 분기해서 아래와 같이 처리해 줄 수 있다. but! 분기가 많아 질수록 길어지는 조건문이 직
[wetube.02] 4.0 to 5.10
app.use -> "/users" 로 시작하는 url 에 접근하면 userRouter에 있는 컨트롤러를 찾게한다. -> userRouter에는 "/edit" 루트 한 가지 밖에 없다. -> handleEditUser 함수 실행 코드를 깔끔하게 작성하기 위해 Route
setTimeout/setInterval
프로젝트 중 슬라이드가 초마다 넘어가는 것을 구현하고 싶었다.keyword는 setTimeout/setIntervalsetTimeout은 일정시간이 지난 후 함수를 실행setInterval은 일정시간적을 함수를 반복둘다 계속 반복적으로 실행되는 줄 알았다. 그런데 co
Route component
Route에서 프로젝트 작업 중main페이지를 3개의 branch로 나눠서 작업!그런데 갑자기 혼동이 왔다..이러면 어떻게 서로 붙여야 하지...?ex)main.jsfilter.js두가지 파일이 있으면 main 작업완료 후 master로 가서 filter branch를
React Router
typescript에서 react-router-dom을 사용하려면 별도의 package를 설치해야 함npm i @types/react-router-domRouter사용 예시Switch: 한 번에 하나의 Route만 Render하게 해줌
react-router 주요 컴포넌트
BrowserRouter / HashRouter / MemoryRouter / StaticRouter / Route / Link
Vue3 에 vue-route 추가하기
멋모르고 npm install vue-router 추가했었는데 잘 안되더라. 알고보니 vue-router@next 를 설치해야했었다.