younaeun younaeun

useState는 리액트에 동적인 요소를 추가해주는 함수이다. 리액트 16.8 이전에는 함수 컴포넌트에서 상태 관리가 불가능했지만, 16.8에서 *Hooks 라는 기능이 도입되며 함수형 컴포넌트에서 상태 변경이 가능해졌다. (useState도 Hooks의 일종) -> Hooks : React 버전 16.8부터 React 요소로 새로 추가되었으며, 기존 Class 바탕의 코드를 작성할 필요 없이 상태 값과 여러 React의 기능을 사용할 수 있게 해준다. useState를 배우기 앞서 state란 상태를 말한다. 예를 들어 시간이라는 컴포넌트가 있으면 현재 시간을 state로 가질 수 있음 useState를 사용하기 위해선 🔽 import { useState } from 'react' 이런 식으로 프로젝트..

오늘은 화살표 함수(arrow function)에 대해 정리해보겠다. 화살표 함수란? -> 화살표 함수는 전통적인 함수표현의 간편한 대안임 but 몇 가지 제한이 있음 this나 super에 대한 바인딩이 없고, methods 로 사용될 수 없습니다. new.target키워드가 없습니다. 일반적으로 스코프를 지정할 때 사용하는 call, apply, bind methods를 이용할 수 없습니다. 생성자(Constructor)로 사용할 수 없습니다. yield를 화살표 함수 내부에서 사용할 수 없습니다 지금은 this랑 super을 못 쓴다는 것 정도만 알면 충분할 듯 그럼 구체적으로 ㄱㄱ 1) (매개변수) => { 본문 } 기존의 함수 표현식에서 function 키워드를 삭제하고 괄호()와 코드블록({}..

오늘은 react-router-dom의 대표적인 문법인 browserRouter, Route, Link에 대해 설명해보겠다. 우선 react-router-dom이란? 리액트에서 Spa 구현할 때 가장 많이 쓰는 라우터이다. *spa(single page application) - 전체 화면 로드 x (로딩 시간 지연) 일부만 변경 o 그리고 여기서 가장 헷갈리는 개념이 라우터였는데 지민이가 설명해줬다. 위는 github.com의 페이지이다. 여기서 옆의 yunaeun/yunaeun의 버튼을 누르면 주소가 바뀌며 이동하게 된다. 아아주 옛날옛적엔 페이지를 통채로 옮기는 방식을 사용했고, 그 후엔 백엔드를 통해 페이지를 넘겨줬다고 한다. 그리고 현재, 라우터가 손쉽게 다른 페이지를 볼 수 있게 해준다. ->..