본문 바로가기
728x90
반응형

리액트59

styled-components 쓰면 CSS 파일 없어도 되는데 보호되어 있는 글 입니다. 2024. 5. 21.
리액트 라우터 3 : URL 파라미터로 상세페이지 100개 만들기 보호되어 있는 글 입니다. 2024. 5. 20.
리액트 라우터 2 : navigate, nested routes, outlet 보호되어 있는 글 입니다. 2024. 5. 20.
[리액트] - 데이터 바인딩 / 컴포넌트화 / props 활용 / map() 활용 다른 js 파일에 있는 html을state에 보관해 놓고 html에 데이터 바인딩하기- export / importdata.js 에 있는 html 이 담긴 변수 data 를 App.js 로 옮기기export default 변수명;  - 변수 1개 할 경우,export {변수1, 변수2}; - 변수 2개 이상 할 경우 (default 사용 안함)//data.js에 있는 것let data = [ { id: 0, title: "White and Black", content: "Born in France", price: 120000, }, { id: 1, title: "Red Knit", content: "Born in Seoul", price: 110000, .. 2024. 5. 19.
리액트 라우터 1 : 셋팅이랑 기본 라우팅 보호되어 있는 글 입니다. 2024. 5. 18.
저번 시간 숙제 해설 (Card 컴포넌트 만들기) 보호되어 있는 글 입니다. 2024. 5. 17.
코드 길어지면 import export 하면 됩니다 보호되어 있는 글 입니다. 2024. 5. 17.
이미지 넣는 법 & public 폴더 이용하기 보호되어 있는 글 입니다. 2024. 5. 17.
새로운 프로젝트 생성 & Bootstrap 사용하기 오늘부터 쇼핑몰 프로젝트를 새로 만들어봅시다.그래서 새로운 리액트 프로젝트 생성부터 하면 되는데 CSS짜기 귀찮으니 react-bootstrap 라이브러리를 설치해서 레이아웃을 좀 쉽게 복사붙여넣기 식으로 만들어봅시다.   새로운 프로젝트 생성은 ▲ 1. 작업폴더에 shift + 우클릭해서 powershell/터미널 열고   2. 터미널에 리액트 프로젝트 생성 명령어 입력합니다.npx create-react-app shop그럼 shop이라는 프로젝트가 하나 하위폴더로 생성됩니다.  3. shop이라는 폴더를 VScode 에디터로 오픈한 뒤에 코드짭시다.4. App.js에 필요없는 html들은 지우고 div 하나만 남겨두고 시작합시다.import logo from "./logo.svg";import "./.. 2024. 5. 16.
728x90
반응형