보라코딩

Component 사용하면 좋은 경우 1. 반복적인 html 축약시 2. 큰 페이지 3. 자주 변경되는 것들 Conponent 만들기 1. function 만들기 (단, 기존 function App() {} 여기 밖에 만들어줘야 함! function Modal() {

버튼 클릭하면 첫번째 제목 바뀌게 기존에 글제목을 array인 state 만들었고 let [글제목, 변경] = useState([ "동탄 맛집 추천", "강남 맛집 추천", "리액트 강의 추천", ]); 이를 변경하려면 { let copy = [...글제목]; copy[0] = "배고프다~"; 변경(copy); }} > 글수정 버튼 클릭하면 가나다순 정렬로 바뀌게 { let copy1 = [...글제목.sort()]; 변경(copy1); }} > 가나다정렬

코드 import logo from "./logo.svg"; import "./App.css"; import { useState } from "react"; function App() { let post = "강남 맛집"; let [글제목, b] = useState([ "동탄 맛집 추천", "강남 맛집 추천", "리액트 강의 추천", ]); let [good, goodChange] = useState(0); return ( ReactBlog {글제목[0]}{" "} { goodChange(good + 1); }} > 🌝 {" "} {good} 7월 13일 발행 {글제목[1]} 7월 13일 발행 {글제목[2]} 7월 13일 발행 ); } export default App; 1. onClick={함수 넣기}..

자료 잠깐 저장할 땐 변수 사용하는데 state 사용해도 됨! state 쓰는 이유? - state 쓰던 html은 자동 재렌더링됨! - 변동시 자동으로 html에 반영되게 만들고 싶으면 사용! - 자주 변경될 것 같은 html은 state로 만들어놓기! ** 렌더링이란 서버로부터 HTML 파일을 받아 브라우저에 뿌려주는 과정

App.js 시작! JSX : .js 파일에서 쓰는 html 대용품 1. class 넣을땐 className 사용하기 2. 변수 넣을땐 {중괄호} = 데이터바인딩은 {중괄호} 3. style 넣을땐 style={ { 스타일명 : '값' } } 기존에는 font-size 인데 - 사용하면 안돼서 fontSize로 사용해야 함! 블로그 에러는 터미널이나 개발자도구의 console에서 확인하기!

코딩애플 강의 참고! 1. nodejs 설치 Node.js Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine. nodejs.org 2. 폴더 만들고 shift+오른쪽마우스 클릭 => powershell 창 열기 npm create-react-app blog -> 리액트 no such file or directory, 등의 에러가 발생하여 터미널에 npm install -g create-react-app 하니 해결 완료 3. VSC에서 blog 폴더 열어주고 터미널에 작성 npm start -> 내 경우, VSCode 터미널이 PowerShell로 되어 있어서 cmd로 변경하니 에러 해결