요르딩딩

8.1) 프로젝트 소개 및 준비 8.2) UI 구현하기 # Appimport "./App.css";import Header from "./components/Header";import Editor from "./components/Editor";import List from "./components/List";function App() { return ( );}export default App;.App { width: 500px; margin: 0 auto; display: flex; // 자식요소의 배치를 유연하게 해줌 flex-direction: column; // 열 기준 세로로 배치해줌 gap: 10px; // 간격} # Headerim..

7.1) 라이프사이클이란?  7.2) useEffect 사용하기 import "./App.css";import Viewer from "./components/Viewer";import Controller from "./components/Controller";import { useState } from "react";function App() { const [count, setCount] = useState(0); const onClickButton = (value) => { setCount(count + value); }; return ( Simple Counter );}export defaul..

6.1) 프로젝트 소개 및 준비 6.2) UI 구현하기import "./App.css";import Viewer from "./components/Viewer";import Controller from "./components/Controller";import { useState } from "react";function App() { return ( Simple Counter );}export default App;const Viewer = () => { return ( 현재 카운트 : 0 );};export default Viewer;const Controller = ..