react

React.js는 특히 SPA(Single Page Application)을 위한 사용자 인터페이스를 구축하는데 사용되는 오픈 소스 JavaScirpt 라이브러리 입니다. 웹 및 모바일 앱의 view layer를 처리하는데 사용됩니다. 또한 React를 사용하면 재사용

리액트의 장점 1\. Single Page Application 만들 수 있다.2\. componnent로 html 재사용 편리3\. 데이터가 html에 자동 반영된다.다른 유사 프레임 워크들이 많은데 이 중에 React가 나은점은사람들이 제일 많이 쓰기 때문이다.리액

React에서는 본질적으로 렌더링 로직이 UI 로직(이벤트가 처리되는 방식, 시간에 따라 state가 변하는 방식, 화면에 표시하기 위해 데이터가 준비되는 방식 등)과 연결된다는 사실을 받아들입니다.React는 별도의 파일에 마크업과 로직을 넣어 기술을 인위적으로 분리

엘리먼트는 React 앱의 가장 작은 단위입니다. 엘리먼트는 화면에 표시할 내용을 기술합니다.브라우저 DOM 엘리먼트와 달리 React 엘리먼트는 일반 객체이며(plain object) 쉽게 생성할 수 있습니다. React DOM은 React 엘리먼트와 일치하도록 DO

개념적으로 컴포넌트는 JavaScript 함수와 유사합니다. "props"라고 하는 임의의 입력을 받은 후, 화면에 어떻게 표시되는지를 기술하는 React 엘리먼트를 반환합니다.컴포넌트를 정의하는 가장 간단한 방법은 JavaScript 함수를 작성하는 것입니다.이 함수

대신에 setState()를 사용합니다.this.state를 지정할 수 있는 유일한 공간은 바로 constructor 입니다.React는 성능을 위해 여러 setState() 호출을 단일 업데이트로 한꺼번에 처리할 수 있습니다.this.props 와 this.state

우리가 흔히 말하는 "페이지 이동" 이라는 것은 리액트에서 라우터를 통해 처리할 수 있다. 그럼 라우터는 무엇일까우선 리액트는 SPA (Single Page Application) 방식인데 SPA부터 알아보자기존 웹 페이지 처럼(MPA 방식) 여러개의 페이지를 사용,

우리는 CRA를 통해 리액트 프로젝트를 만들고 index.js 파일의 맨 밑을 보면 reportWebVitals() 라는 함수를 호출하고 있는 것이 보이는데 이것의 역할은 무엇일까?주석 처리된 예 처럼 함수에 console.log를 넣어주면 개발창으로 앱의 퍼포먼스시간

처음에 CRA를 하고나서 index.js 에 <React.StrictMode>라는 태그를 볼 수 있는데 지워도 실행하는데 지장이 없길래 찾아 보았다.리액트 공식문서에 따르면,"StrictMode는 애플리케이션 내의 잠재적인 문제를 알아내기 위한 도구입니다. Fra

Hook은 React 버전 16.8부터 React 요소로 새로 추가되었습니다. Hook을 이용하여 기존 Class 바탕의 코드를 작성할 필요 없이 상태 값과 여러 React의 기능을 사용할 수 있습니다.선택적 사용 : 기존의 코드를 다시 작성할 필요 없이 일부의 컴포넌

리액트 가져오기// imr ->import React from 'react'리액트 + Component 가져오기// imrc ->import React, { Component } from 'react'import a default module (기본 모듈 가져오기)//

이름 그대로 변하지 않는 데이터. 즉, 정적인 데이터UI 구성에 필요하지만 동적으로 변하지 않아서 백엔드 API등을 통해서 가져올 필요가 없는 정적인 데이터들을 상수 데이터로 만들어 UI를 효율적으로 구성할 수 있습니다.반복되는 UI를 하드코딩으로 일일이 만들어두게 되

배경 백엔드로부터 데이터를 받아오려면 api를 호출하고 데이터를 응답받습니다. 이 때 자바스크립트 Web API

사전적으로 불변성이란 값이나 상태를 변경할 수 없는 것을 의미합니다.예시를 들어 보겠습니다. 위 예시에서 string은 data1이 되고 값이 data2로 변경된 것 처럼 보이지만 실제 메모리영역에는 'data1','data2' 둘 다 존재합니다. 이렇게 되면 메모리

CSS-in-JS는 자바스크립트 파일 안에서 css를 작성할 수 있는 방법입니다.Sass와 같은 css 전처리기가 등장했음에도 불구하고 자바스크립트의 상태 값을 공유할 수 없어서 동적으로 스타일링을 하기 위해서는 인라인 스타일을 이용하거나 css 클래스명으로 조건부 스

Axios는 브라우저, Node.js를 위한 Promise API를 활용하는 HTTP 비동기 통신 라이브러리 이다.쉽게 말해서 백엔드랑 프론트엔드랑 통신을 쉽게하기 위해 Ajax와 더불어 사용한다.이미 자바스크립트에는 fetch api가 있지만, 프레임워크에서 ajax