React (old ver)/basic19 state를 이용한 데이터 바인딩 새로고침 없이 데이터를 변동하고 싶을 경우, 해당 데이터는 useState( )를 이용하여 바인딩되어야 한다. 그 방법은 다음과 같다. import React, { useState } from 'react'; import './App.css'; function App() { let [title, setTitle] = useState('state 바인딩이란?'); let [liked, setLiked] = useState(0); return ( { title } { setLiked( liked + 1 ) } }>♥ { liked } ); } export default App; 1. useState( )를 사용할 것임을 선언 import React from 'react'; // before import Re.. 2021. 10. 29. JSX로 html 작성하기 import logo from './logo.svg'; function App() { let title = 'Blog'; function thisYear(){ let now = new Date(); return now.getFullYear(); } return ( { title } { thisYear() } ); } export default App; 1. class → className javascript 기반에서 작업하는 것이기 때문에, javascript에 선언되어있는 class는 사용할 수 없다. 이에 react에서는 class가 아닌 className으로 클래스명을 지정해야 한다. 2. style은 camelClass 프로퍼티 명명 규칙을 사용 태그 안에 직접 style을 지정할 땐 이중 중괄호.. 2021. 10. 29. App.js가 메인 페이지 funtion App(){retrun ( @@ )}, @@ 안에 들어있는 html이 main페이지의 html이 된다. 그 이유는 index.js가 App.js를 읽고 public > index.html에 넣어주기 때문. 2021. 10. 29. react 설치 및 개발환경 설정 (node 14.17.0으로 설치 진행하였습니다) 1. node 및 vscode 설치 Node.js Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine. nodejs.org Visual Studio Code - Code Editing. Redefined Visual Studio Code is a code editor redefined and optimized for building and debugging modern web and cloud applications. Visual Studio Code is free and available on your favorite platform - Linux, macOS, and Wind.. 2021. 8. 11. 이전 1 2 다음
