응애 개발자 응애 개발자

React Router란? React Router는 브라우저의 URL 경로에 따라 다른 컴포넌트를 렌더링하고, 애플리케이션의 상태를 업데이트하며, 페이지 전환을 처리하는 기능을 제공합니다. 이를 통해 사용자가 다른 경로로 이동하거나 애플리케이션의 상태를 변경할 때 페이지 전체를 다시 불러오지 않고도 부분적인 업데이트를 할 수 있습니다. V5 Router.tsx import { BrowserRouter, Routes, Route } from "react-router-dom"; import Header from "./components/Header"; import Home from "./screens/Home"; import About from "./screens/About"; function Router(..

💡 styled-components는 React에서 스타일을 적용하기 위한 강력한 라이브러리입니다. 이를 사용하면 JavaScript 코드 내에서 CSS 스타일을 작성하고 컴포넌트에 적용할 수 있습니다. install npm i styled-components styled-components install error styled-compoennts intsall 시에 아래와 같은 error를 마주한다면 npm ERR! Cannot read properties of null (reading 'edgesOut') 다음과 같이 해결 npm install styled-components@latest // or yarn 사용 yarn install styled-components styled-components ..

1. React 프로젝트 만들기 - cmd 창에서 실행 npx create-react-app frontend - 최상위 폴더에 생성된 React 폴더 넣기 - VSC에서 최상위 폴더를 열기 2. package.json 생성 - 터미널에서 package.json 파일 생성 명령어 입력 npm init 3. express 설치 npm i express 4. src 폴더 생성 후 server.js 파일 생성 5-1. nodemon 설치 - 서버에 변동사항이 있을 때마다 자동으로 서버 재부팅 실행 npm i nodemon 5-2. babel 설치 - 최신문법을 사용하더라도 서버가 해당 코드를 인식할 수 있도록 해주는 패키지 npm i @babel/preset-env @babel/core @babel/node 5..

1. React 프로젝트 만들기 npx create-react-app 폴더명 vsc에서 해당 폴더 열기 code react-project 2. PropTypes 설치 npm i prop-types 사용 import PropTypes from "prop-types"; function Button({text}){ return {text}; }; Button.propTypes = { text: PropTypes.string.isRequired, };