Switch 라는 태그는 자식인 들 중에서 현재 URL과 일치하는 첫번째 것을 렌더해준다. import React from "react"; import { BrowserRouter, Route, Switch } from "react-router-dom"; import "./app.css"; import Home from "./components/home"; import Profile from "./components/profile"; function App() { return ( ); } export default App; 이렇게 작성하면 경로에 맞는 컴포넌트를 렌더해주는 것이다. Link Switch 안에서가 아니더라도 Link를 이용하면 원하는 컴포넌트로 이동할 수 있다. (마치 html의 a 태그의..

react-router에서 해당하는 경로에 맞는 컴포넌트를 렌더하는 방법은 3가지가 있다. 1. 의 자식으로 렌더하는 방법 import React from "react"; import { BrowserRouter, Link, Route} from "react-router-dom"; import "./app.css"; import Home from "./components/home"; import Profile from "./components/profile"; function App() { return ( ); } export default App; 하지만 위와 같이 쓰면 route 관련 props인 location, history, match를 받아올 수 없다. 2. 를 이용하여 렌더하는 방법 impo..

2.11 MVC Pattern - Part. 3 컨트롤러 만들기(Controller) 이제 여기 이 구조에서 자유로워지기 위해 controller를 사용할 차례이다. 컨트롤러는 어떤 일이 어떻게 발생하는지에 관한 로직이다. 여기에 있는 모든 함수들을 말하는 것이다. 여기 이 함수들을 모두 컨트롤러에 담을 것이다. 1) controllers 폴더를 만든다. 그리고 그 안에는 비디오 컨트롤러(videoController.js)와 유저 컨트롤러(userController.js) 이렇게 두 개의 컨트롤러를 만들 것이다. 대게 프로젝트에 있는 각 모델마다 컨트롤러를 만들게 된다. route에는 global , users, videos가 있고 global 안에는 home, join, login,logout, sea..