개발하는 인사담당자 개발하는 인사담당자

■ 라우팅 : 어떤 네트워크 내에서 통신 데이터를 보낼 경로를 선택하는 일련의 과정 네트워크 장치들을 통해 전달되는데 실시간으로 어디로 가야하는지 갈 길을 알려줌 이런 경로를 정해주는 행위 자체와 그런 과정 다 포함하여 일컫는 말 ■ 페이지 라우팅 : 어떤 요청에 따라 떤 페이지를 돌려줄 지 결정하는 것 MPA(Multipage Application) : 여러가지 페이지를 가지고 있다가 맞는 페이지를 보여줌 npm install react-router-dom@latest : 최신 버전 react router 설치 이동 시 리액트 내 Link 활용 경로는 to={ } 를 통해 설정 ■ Path variable ■ Query String useSearchParams 사용 QS 변경도 가능 ■ Page Mov..

■ useRef MutableRefObject html DOM 요소에 접근할 수 있다. 다음과 같이 ref={ } 를 통해 input 에 접근이 가능하다. 현재(current) 가리키는 값을 포커스 처리해준다. getTime() : 시간을 숫자로 반환

1. Component 기반의 UI 라이브러리 : 수정해야 할 부분을 한 번만 수정하면 된다. 2. 선언형 프로그래밍 : 목적을 바로 말한다. 3. Virtual DOM(Document Object Model / 문서객체모델) : 웹브라우저가 html 해석을 자기가 보기 편하게 트리형태로 변환한 것 es module system : export defalt 모듈이름 import 모듈이름 from 경로 방식으로 사용한다. ■ State : 계속해서 변화하는 특정 상태 상태에 따라 각각 다른 동작을 함

크롬의 v8 c++ 로 웹브라우저 이외에 곳에서도 실행 가능했다. Node.js 는 자바스크립트를 브라우저가 아닌 곳에서도 실행시켜보자는 뜻에서 나오게 되었다. 자바스크립트 실행환경 (런타임) node 파일명 : node 를 통해 자바스크립트 파일 실행시키는 법 모듈 : 어떤 기능을 담당하는 분리된 파일 각각을 뜻함 module.exports 로 모듈 내보내기 가능하다. require 을 통해 모듈 불러와서 사용 가능하다. ■ npm(Node Package Manager) : Node.js 패키지 관리 도구 다른 사람들이 만들어 놓은 패키지를 다운받을 수 있다. npm init 을 통해 package.json 파일 만들 수 있다. package.json 우리가 만들 패키지의 정보를 기록하는 환경 설정 파..

■ Truthy { } [ ] "0" (문자열 안 값) "false" (문자열 안 값) Infinity 42 (숫자) ■ Falsy null undefined "" (빈 문자열) 0 (숫자 0) -0 NaN

delete : property 삭제하는 것 (연결 끊는 것) person.name = null 이 방법을 추천 name in person : 해당 프로퍼티가 객체 안에 있는지 확인하는 법 Object.key(객체) : 객체안에 있는 key 값들을 배열로 반환 받을 수 있다. arr.includes(인자) : 받은 인자와 일치하는 값과 타입이 있는지 확인 arr.indexOf(인자) : 배열안에 존재하는 인덱스를 출력해줌, 만약 없다면 -1을 출력 arr.findIndex((elm) => {elm.color === "blue"}) : 콜백 함수를 통해 우리가 원하는 값과 일치하는 배열의 인덱스 출력 arr.find() : 우리가 원하는 요소를 출력 arr.filter() : 특정한 조건을 만족하는 요소 ..

■ React 란? : 리액트란 Facebook 에서 만든 JavaScript 사용자 인터페이스(UI) 라이브러리이다. ■ React 를 사용하는 이유 그렇다면 기존 웹개발에서 왜 React 가 주목을 받고 있을까? 1. 화면 전환의 부드러움 (SPA + Virtual DOM) 현재 토스, 인스타크램, Naver Vibe(Vue) 사이트를 들어가면 화면 전환이 부드럽게 진행된다. 이는 React 나 Vue 와 같이 SPA 의 특징이다. SPA 는 최초 생성된 DOM (Document Object Model) 을 유지하면서 변경 사항만 업데이트를 한다. 여기서 이를 도와주는 것이 바로 Virtual DOM 이다. Virtual DOM 은 실제 DOM 의 복제본(자바스크립트 객체로 표현된 DOM)으로, 웹 ..

Link 는 React 에서 제공하는 a태그 역할을 하는 컴포넌트 상태변경 함수 = Setter ★ 상태가 변경된 후에 useEffect()가 지정한 함수가 실행된다. ⚫ useState(): 상태 생성 및 초기화 ⚫ useEffect(): 상태 변경 후 콜백되는 함수 등록 변수가 아닌 상태로 선언하는 이유는 변수의 경우에는 함수가 끝나면 사라지지만, 상태는 사라지지 않는다. 더불어 만약 상태의 값이 변경되었을 때 상태는 해당 부분을 리랜더링 해준다. 상태를 변경할 떄는 상태 변경 함수를 통해 변경해야 한다. 어려운 이유 1. 자바스크립트 문법 2. 복제하고 값을 대입해야 하는 것 -> 이전 상태는 회손하면 안된다. 새로운 전체 배열을 만들어서 대체해야 한다. 상태 usestate, reduce 전역변수..