React 좋아요 누를때마다 1씩 증가하는 버튼 만들기
·
Programming/React
state, 함수 이용 좋아요 버튼을 누르면 숫자가 올라가게끔 만들 것이다. 이때 숫자는 누르는 횟수만큼 +1이 되기 때문에 state를 써줄 것이다. 1단계 : 형태만 만들기 import {useState} from "react"; function App() { let [heart] =useState(0); return ( 좋아요 ❤️ {heart} ); } 2단계 : 좋아요를 눌렀을 때 0이 1로 바뀌도록 (onClick 사용) import {useState} from "react"; function App() { let [heart, heartAlterNums] =useState(0); return ( 좋아요 hearAlterNums(1)}> ❤️ {heart} ); } 3단계 : 누를때마다 +1이..
React 변수에 있던 자료를 HTML에 넣기
·
Programming/React
import "./App.css"; function App() { let post = '강남 우동 맛집'; // 서버에서 가져온 실제 테이터라는 가정 return ( 네비게이션 바 {post} ); } export default App; let post 로 변수 저장한 후 중괄호 {}를 이용해 불러올 수 있다.
JSX란? JS와 JSX의 차이점
·
Programming/JavaScript
1. JSX란 함수 호출과 객체 생성을 위한 문법적 편의를 제공하는 JavaS 의 확장 2. JSX의 장점 1. 개발자 편의성 향상 2. 협업에 용이 / 생산성 향상 -> 디자이너 분들이 코드를 보더라도 구조를 파악하기 쉬워서 협업에 용이! 3. 문법 오류와 코드량 감소 3. JSX의 특징 HTML 태그 내에 JavaScript 연산 가능! 3. JS 와 JSX 차이점