문제 상황 리액트를 사용하여 포트폴리오 제작을 준비하고 있는 와중 발생한 에러입니다. react-router-dom을 사용하여 App.js에서 라우팅을 구현하였습니다. (여기서 Router는 BrowserRouter입니다.) function App() { return ( ); } "/"경로로 접속한 메인페이지에서 "/portfolio" 로 헤더의 Link to를 클릭해서 이동하면 url은 정상적으로 바뀌나 페이지는 렌더링 되지 않는 현상이 발생했습니다. 여기서 새로고침 버튼을 클릭하면 페이지가 정상적으로 렌더링 되었습니다. function Header(props){ return( portfolio Wonseok About Reference Youtube Script Contact ) } 공식 문서, 스택..
리액트를 공부하며 습득한 기초 문법들을 정리한 글입니다. 학습을 진행하며 내용을 추가하도록 하겠씁니다. 1. render render는 페이지에 어떤 컴포넌트나 요소를 전달하여 전시하도록 하는 기능입니다. 1. render() React 엘리먼트를 루트 DOM 노드에 렌더링하려면 ReactDOM.render()로 전달하면 됩니다. import React from 'react'; import ReactDOM from 'react-dom'; ReactDOM.render(Hello, React, document.getElementById("root")); 2. JSX로 render() JSX문법을 사용하여 렌더링할 수 있습니다. import React from 'react'; import ReactDOM fr..
React.js 새로 React에 대해 공부할 기회가 생겨 개념을 정리해보려 합니다. React의 개념과 특징, 사용성에 대해 알아보도록 하겠습니다. 가장 먼저, React의 정의는 다음과 같습니다. React는 웹 프레임워크로, 자바스크립트 라이브러리의 하나로서 사용자 인터페이스를 만들기 위해 사용된다. Facebook에서 제공하는 라이브러리이며, 싱글 페이지 어플리케이션(SPA)나 모바일 어플리케이션 구현에 주로 사용됩니다. React의 특징 리액트의 특징은 크게 다음과 같습니다. Props and State Component 기반 구조 가상 DOM 트리 뷰 라이브러리 1. Props and State 리액트는 단방향 데이터 흐름 (one-way data flow)라는 특징을 갖고 있습니다. 다른 말..