프론트앤드개발자
-
React) Router카테고리 없음 2023. 1. 27. 03:20
React는 SPA이다. SPA (Single Page Application) 여기서 Application이란? 유저랑 상호작용할 수 있는 웹페이지를 의미한다. 웹페이지 경로마다 브라우저가 HTML을 다운받아서 브라우저 화면에 그려야 하는데, 전체 웹사이트에 HTML이 딱 하나 있으면 그릴 수 있는 웹페이지도 하나밖에 없을 것이라 생각할 수 있다. React는 HTML 파일이 1개가 존재하지만, UI를 구성하는 코드는 javascript 파일에 있다. 이 파일은 index.html의 태그 중에 id 선택자가 root인 div태그에 DOM으로 연결되어 화면에 그려지므로, HTML 파일은 하나만 있어도 javascript 파일이 여러개 있으면 MPA 처럼 여러페이지를 브라우저 화면에 나타낼 수 있고, 하나의..
-
React) Use State (예제 2개 포함)카테고리 없음 2023. 1. 24. 12:46
State? : 컴포넌트가 가질 수 있는 상태 useState? : 우리 컴포넌트의 상태를 간편하게 생성하고, 업데이트 시킬 수 있게 해 주는 도구를 제공해 준다. const [state, setState] = useState(초기값); // state 생성과 함께 가져야할 초기값을 useSate 함수의 인자로 넣어주면 //state와 setState라는 두가지 요소를 배열 형태로 return 해 준다. - state(변수) : 현재 상태 값 - setState(함수) : state를 변경시켜주고 싶을 때 더보기 예시) const [time, setTime] = useState(5); // 컴포넌트 안에는 time 이라는 state 가 생성되고, 초기값은 5시 를 갖게됨 // 이때, 시간을 변경하고 싶으..