서스포PAR_개발블로그

🤦‍♀️ 문제의 발단 벨로퍼트님의 모던 리액트 1-13장 배열에 항목 추가하기에서 오류가 발견하였다. 배열로 잘 뜨는데 왜? Uncaught TypeError: Cannot read properties of undefined (reading 'map') 가 뜨는 것인가? import React from 'react'; const UserList = ({ user }) => { console.log(user); // 0: {id: 1, username: '홍길동', email: '123@naver.com'} // 1: {id: 2, username: '김철수', email: '456@naver.com'} // 2: {id: 3, username: '김영희', email: '789@naver.com'} re..

build를 진행하다가 새로운 이슈에 직면하였다. 그것을 해결하기 위해 어떤것을 하였는지 과정을 나열하였다. 📑 serve -s build 오류 메세지 serve : 이 시스템에서 스크립트를 실행할 수 없으므로 C:\Users\win10\AppData\Roamin g\npm\serve.ps1 파일을 로드할 수 없습니다. 자세한 내용은 http://go.microsoft.com/ fwlink/?LinkID=135170의 about_Execution_Policies를 참조하십시오. 위치 줄:1 문자:1 + serve -s build + ~~~~~ + CategoryInfo : 보안 오류: (:) [], PSSecurityException + FullyQualifiedErrorId : UnauthorizedA..

리액트 프로젝트를 하기 위해서 화면을 전환을 위해 사용하는 React-router-dom을 사용하는데 🎁 기본이론부터 v6로 업데이트까지 알아보자! 🎁 💖 React-Router 1. 가장 많이 사용되는 라이브러리 중 하나로, 클라이언트 사이드에서 이루어지는 라우팅을 간단하게 해주며 서버 사이드 렌더링을 도와주는 도구들을 제공합니다. 2. React-Router 를 통해 Link 태그를 사용하여 화면을 전환한다. 리액트는 변화가 있는 컴포넌트만 업데이트하여 효율적으로 성능을 관리하는 구조로 페이지 이동 시 굳이 화면 전체를 새로고침 할 필요가 없습니다. (주소값의 변경에 따라 페이지 혹은 컴포넌트의 변화를 제공하기 위한 라이브러리) 3. react-router는 페이스북에서 공식으로 지원하고 있는 라이브..

21년 12월 14일에 create-react-app이 4.0.3 버전에서 5.0.0로 업데이트 되었습니다. 그럼 기존에 사용하는 사람이 어떻게 해결하는지에 대해서 알아봅시다! 🎁 create-react-app 페이스북 깃허브 🎁 https://github.com/facebook/create-react-app GitHub - facebook/create-react-app: Set up a modern web app by running one command. Set up a modern web app by running one command. Contribute to facebook/create-react-app development by creating an account on GitHub. github..

프론트엔드 개발자가 되기위해 나는 리액트를 선택하였다. ✨리액트에 대해서 천천히 알아보자 ✨ 💖 React 1. React는 페이스북에서 제공하는 프론트엔드 라이브러리다. 2. React는 SPA(Single Page Application)을 위한 사용자 인터페이스를 구축하는 데 사용된다. - 즉 싱글페이지 애플리케이션이나 모바일 애플리케이션의 개발 시 사용. 3. React 는 웹을 만드는 데 꼭 필요한 도구들이 전부 기본적으로 제공되지 않는다. 4. React의 주요 목적은 가볍고, 빠르고 확장 가능하며 단순 것 입니다. 5. React를 사용하면 개발자가 페이지를 다시 로드하지 않고도 데이터를 변경할 수 있는 대규모 웹 어플리케이션을 만들 수 있다. 6. React는 컴포넌트 기반으로 컴포넌트에 데..