머리가 비상하지않으므로 열심히 노력해야한다. 느껴진다! 재능이 없다면 재능이 있는척 열심히 따라가야지 코딩애플에서 쇼핑몰프로젝트를 완성하고 github에 잔디를 심었다. github는 사실 공부를 했단걸 보여주는 목적으로 올리고있는데 매일매일 올리는 재미가있다. 이제는 노마드코더를 보며 따라하고있다. 이렇게 따라하는것부터 시작해서 조금 익숙해지면 멘땅에 해딩하는것을 해봐야겠다! 간단한 todolist를 따라해보고 githu에 올렸으나, 블로그에도 코드 기록을 남겨봐야겠다 import logo from './logo.svg'; import {useState, useEffect} from "react" import './App.css'; function App() { const [toDo, setTodo] ..
리액트 hook (useState와 useEffect)
React의 단방향 데이터 흐름 props를 단방향으로 내려준다. 동일한 props를 전달하면, 동일한화면이 렌더링되어야한다. 한 함수는 동일한 Input에, 동일한 output이 나와야한다 => pure function 리액트의 훅은 컴포넌트의 lifecycle 개념과 관련이있다. 일부 블로그들을 보면 개념설명이 너무 어렵게되어있어서 이해가 어려웠다. 내가 알아볼수있도록 정리해보자! 컴포넌트의 Lifecycle : 컴포넌트의 인생 컴포넌트 -> 등장 -> 업데이트(재렌더링) -> 퇴장 Hook을 통하여 컴포넌트의 인생에 딴지를 걸수있다. Lifecycle의 hook 원래는 class 컴포넌트에서 componentDidmount() : 컴포넌트가 마운트(등장)가되엇을때 특정 코드를 실행해주세요 compo..
React
데이터는? 1.변수에넣는다. 2.State에넣는다. 2번째경우인 State에 대해서 알아봅시다 State : 변수대신 쓰는 데이터 저장공간 ,useState()를 이용해 만들어야함 state 만드는법 {useState} 상단에 첨부 useState(데이터) [변수,변경해주는함수] = useState // 구조분해할당 변경해주는 함수가 실행되면 변수는계속업데이트되서 저장됨 State 사용 이유 웹이 APP처럼 동작하게 만들고싶을때 사용 HTML이 자동으로 재렌더링된다. State 변경방법 state는 그냥 변경이 안된다. 변경함수를 통하여 바꿔준다. Array,object 데이터 수정방법 일단 변경함수를 써야한다. -변경함수 (대체할 데이터) state는 건들이면안된다. => 복사본을 뜨자. deep co..