# router

311개의 포스트
post-thumbnail

[React] 리액트 라우터(Router v6) 세팅 및 사용 방법

react-router-dom 설치 👉🏽 참고 React Router 공식 문서

약 14시간 전
·
0개의 댓글
·
post-thumbnail

Router

먼저 전시간 복습으로 Single Page Application(SPA)에 대해 알고 넘어 가자 인터넷에 접속하기 위해서는 웹브라우저가 필요하다 웹브라우저를 통해 화면에 보여지는 문서가 웹페이지이고 웹사이트를 다양한 방식으로 그룹으로 묶이거나 연결된 웹페이지들의 모음이

약 21시간 전
·
0개의 댓글
·

[React] react-router-dom이란?

1. spa와 mpa mpa : multi pages application spa : single page application으로 웹페이지가 몇개의 html파일로 이뤄져있냐에 따라 나뉜다. 이전의 html과 순수 js에서는 하나의 웹사이트 안에서도 페이지를 이동하기

3일 전
·
0개의 댓글
·

express router

라우팅은 애플리케이션 엔드 포인트(URI)의 정의, 그리고 URI가 클라이언트 요청에 응답하는 방식을 말한다.익스프레스를 사용하며 이번주는 이것저것 만져보고있다.미들웨어와 라우터 등 여러가지 기능에대해서 공부를 하고있는데 정말 배울게 많고 많다.개인과제를 발제받고 어제

4일 전
·
0개의 댓글
·

리엑트 라우터 3 : url파라미터 사용해보기

특정 component에 urlParams를 사용한 데이터 바인딩으로 동적인 페이지 구현해 보려고 한다. 우선 app.js안에 <Detail>component를 사용하는곳에 shoes라는 props를 전송했다. Detail 컴포넌트는 props파라미터를 등록해서

5일 전
·
0개의 댓글
·
post-thumbnail

[ About React ⭐ ] 리액트 Router, Link 사용법

리액트에서 URL에 따라 원하는 컴포넌트를 불러야할 땐 Router를 사용하면 상당히 쉽게 가능함.먼저 npm 다운 받기라우팅 해줄 컴포넌트에서 import아래와 같은 형식으로 필요한 경로 마다 Route 태그로 경로, 컴포넌트를 설정해줌새로고침 없이 페이지를 이동 시

7일 전
·
0개의 댓글
·
post-thumbnail

[React-Native] Navigation

좀만 더 나중에 만났으면 좋았을텐데 너,, 두고봐,,

2022년 9월 28일
·
0개의 댓글
·

[React] Routing

터미널에 npm install react-router-dom@6 입력index.js → import { BrowserRouter } from "react-router-dom"; → <BrowserRouter> <App / > </BrowserRout

2022년 9월 27일
·
0개의 댓글
·

React Router

loader, reactrouter.comDynamic Segments, reactrouter.com(https://reactrouter.com/en/main/route/routeloader: Each route can define a "loader" func

2022년 9월 26일
·
0개의 댓글
·
post-thumbnail

💻 비드마켓 리팩토링 - 페이지 로딩 적용

⚠️ 정리한 내용은 오타나 잘못된 정보가 있을 수 있습니다. 댓글로 알려주시면 감사하겠습니다. 상품 카드를 눌렀을 때 getServerSideProps로 서버에서 데이터를 먼저 가져오기 전까지 로딩 처리가 없어서 화면이 멈춰있는 것 처럼 보이는 문제가 발생하였다.이런

2022년 9월 23일
·
0개의 댓글
·

history.push에 data담아 보내기

history.push는 주로 라우팅할때만 사용했었는데, props로 내려주는 것 말고 이동한 url로 데이터를 날려주는 것이 필요했다. 찾아보니 history.push에 데이터를 담을 수 있었다...! history.push로 데이터 날리기 데이터 보내는 곳 받는곳 그래서 바로 해보았는데.... 하얀화면만 뜨고, 콘솔에 에러 메시지도 뜨지 않았다....

2022년 9월 21일
·
0개의 댓글
·
post-thumbnail

[React] Router - useNavigate, useLoaction, useParams

useNavigate? react-router-dom(V6)에서 useHistory를 대체한 새로운 기능 navigate 함수는 두번째 인자도 받을 수 있다! replace의 기본값은 false로 기본적으로 해당 주소로 이동한 뒤, 뒤로가기를 하면 이전 페이지로 되

2022년 9월 18일
·
0개의 댓글
·
post-thumbnail

TIL | Vue Router

Router를 사용하기 위해서는 여러가지 방법이 있지만, Vue CLI를 사용할때는 add 하면 vue 안에서 오버라이드 해주기 때문에 (파일 백업 준비를 해둬야한다) vue add router 명령어를 사용하면 된다 명령어를 실행하면 레포지토리에 변화가 있는데 진행

2022년 9월 15일
·
0개의 댓글
·
post-thumbnail

[REACT] react-route 를 이용할 때 component 로 props data 보내주는 방법

App.js 에 react-router-dom 을 사용해 페이지를 이동시키고 있다.그런데 post(게시글) 에는 번호가 부여되고, postDetail 에는 해당 게시글만 보여야 한다.그래서 App.js 에서 route 하면서이렇게 해서 해당 게시글로 이동하도록 했다.p

2022년 9월 13일
·
0개의 댓글
·
post-thumbnail

[React] Router

Vue에서 쓰던 방식이랑 비슷한데 달라,, 어렵다 어려워

2022년 9월 6일
·
0개의 댓글
·
post-thumbnail

Vue 바닥부터 프로젝트 생성까지

이번 장에서는 자바스크립트를 더욱 쉽게 사용할 수 있는 자바스크립트의 프레임워크중에 하나인 vue에 대해서 알아보겠습니다. vue란 무엇인지 살펴보고 vue를 설치하고 프로젝트를 생성해 보겠습니다. 그리고 vue 프로젝트의 구조를 살펴보겠습니다.

2022년 9월 3일
·
0개의 댓글
·
post-thumbnail

React Router DOM(feat. SPA)

들어가기전에 리액트는 아주 많은 특징들을 가지고 있지만 그중 가장 큰 특징이자 장점은 SPA를 만들기 용이함에 있다고 생각한다. SPA(Single Page Application)는 말그대로 하나의 페이지를 가지고있는 웹어플리케이션을 의미하며 여기서 하나의 페이지는

2022년 9월 2일
·
0개의 댓글
·
post-thumbnail

Router & Sass

개요 웹페이지와 웹사이트웹페이지는 웹브라우저를 통해 화면에 보여지는 페이지를 의미한다. 웹사이트는 웹페이지들을 다양한 방법으로 묶은 모음을 말한다.주소창 경로입력\-> 경로마다 존재하는 html/css/js파일 받아서 렌더링함. 웹페이지마다 두개 이상의 html이 존재

2022년 8월 29일
·
0개의 댓글
·

Static, Dynamic Routing

라우팅 테이블에 경로를 수동으로 추가해야하는 프로세스이다.예시) "/login" 이면 로그인 페이지로만 이동된다.동적 라우팅은 라우팅 테이블에서 경로의 현재 상태에 따라 경로를 자동으로 조정하나의 경로가 죽으면 다른 대상을 찾아서 자동으로 연결 시켜준다

2022년 8월 26일
·
0개의 댓글
·
post-thumbnail

File-Based Routing System

@TANSTACK/REACT-LOCATION을 사용하여 SPA구조에서 사용가능한 파일 기반 라우팅 시스템을 개발합니다.

2022년 8월 25일
·
0개의 댓글
·