본문 바로가기
728x90
반응형

Study/React3

[React] JSX란? 0. 들어가기에 앞서: React란? JSX를 정리하기에 앞서 간단히 리액트를 정리해보자. 리액트는 페이스북이 만든 사용자 UI 구축을 위한 라이브러리이다. 하나의 단일 url을 가지고 SPA(Single Page Application)으로 사이트를 표현하는 것을 가능케하는 프레임워크다. 이 리액트는 3가지의 대표적인 특징을 가지고 있다. 1. JSX 문법 2. Component 기반 3. Virtual DOM 이번엔 먼저 JSX에 대해 알아보도록 하자. 1. JSX란 쉽게 말해 HTML 문법을 JavaScript 코드 내부에 쓴 것. 그것이 바로 JSX다! 어렵게 말해 JavaScript eXtension.. JavaScript의 확장 버전이고 결론은 자바스크립트이다. "React에서 HTML을 표현할.. 2021. 4. 28.
React Hooks + Mobx 예제 - 슈퍼마켓 구현하기 - Reference URL : hyeok999.github.io/2020/04/16/mobx-hooks-market/ React Hooks + Mobx 예제 - 슈퍼마켓 구현하기 - React Hooks + Mobx 예제 - 슈퍼마켓 구현하기 -목차 소개 시작 데코레이터 설정 X 프로젝트 초기화 및 폴더 구조 카운터 만들기 new: src/stores/counter.js new: src/useStore.js edit: src/App.js new: src/components/Counter.j hyeok999.github.io 소개 2019년에 들어서면서 React 측에서 Hooks를 소개했습니다. Hooks는 React 생태계에서 적지 않은 파생을 일으켰고 많은 코드들이 마이그레이션되었습니다. 오늘 소개할 .. 2021. 4. 28.
React-Hooks 예시 Counter.js import React, { useState } from "react"; const Counter = () => { const [value, setValue] = useState(0); return ( 현재 카운터 값은 {value} setValue(value + 1)}>+1 setValue(value - 1)}>-1 ); }; export default Counter; App.js import Counter from "./Counter"; function App() { return ; } export default App; 2021. 4. 28.
728x90
반응형