react

A JavaScript library for building user interfacesReact 라는 것을 통해 우리는 UI를 Building 할 수 있다.UI를 Building 한다는 것?: 웹 또는 앱 애플리케이션의 UI, 즉 보여지는 부분(Front end 영역

react 개발을 위해서 꼭 필요한 JS 문법 중, ES6 문법에 대해 숙지해야 한다.얕은 복사의 개념과, 이를 방지해야 하는 이유에 대해 알아보자!예전에는 변수하면 모두 var 키워드를 이용했지만, 이제는 const(상수)와 let(변수)을 이용한다.const: 재할

Create React App : Set up a modern web app by running one command.한 줄의 명령어 입력으로 React 프로젝트 개발에 필수요소를 자동으로 구성하는 방법React 프로젝트를 구성하기 위해 필요한 것들은 많다. ex) W

컴포넌트를 통해 UI를 재사용이 가능한 개별적인 여러 조각으로 나누고, 각 조각을 개별적으로 살펴볼 수 있다.개념적으로 컴포넌트는 JavaScript 함수와 유사하다."props"라고 하는 임의의 입력을 받은 후, 화면에 어떻게 표시되는지를 기술하는 React 엘리먼트

JSX? 자바스크립트를 확장한 문법으로 자스의 모든 기능이 포함되어 있으며, React Element를 생성하기 위한 문법 *element: 단순히 화면에 그려지는 HTML적 요소

하나 이상의 인자를 받고, 인자를 변경하지 않고 참조하여 새로운 값을 반환하는 함수즉, 같은 input 동일한 인자가 전달되면 항상 동일한 결과를 반환하는 함수(코드 블록)이다.순수함수는 외부에서 전달받은 값을 변경하면 안된다. 즉, 함수 내부에서 외부로 다른 부작용(

지금까지는 간단하게 리액트를 알아봤지만, 여기선 조금 더 추상적인 개념들을 작성해보겠다.컴포넌트는 리액트의 핵심 빌딩 블록 중 하나로 UI 요소를 표현하는 최소한의 단위이며 화면의 특정 부분이 어떻게 생길지 정하는 선언체이다. 즉, 리액트에서 개발할 모든 애플리케이션은

map() 메서드는 배열 내의 모든 요소 각각에 대하여 주어진 함수를 호출한 결과를 모아 새로운 배열을 반환한다.매개변수 callback새로운 배열 요소를 생성하는 함수. 다음 세 가지 인수를 가진다.1\. currentValue: 처리할 현재 요소2\. index:

하나의 폴더 안에 모든 컴포넌트를 만들어서 관리하면 시간이 흐를수록 컴포넌트가 많아져서 원하는 컴포넌트를 찾기가 힘들어질 것이다. 그래서 연관된 컴포넌트끼리 폴더를 만들어서 관리하는 것이 컴포넌트를 찾기 수월하다.\-> App.js에서 import 해줘야한다!둘 다 모

list page: '/'create page: 'create/postNum'update page: 'update/postNum'detail page: 'detail/postNum'createlist page -> create 버튼 클릭 -> create page(po

React-Query를 이용해 서버에 변경 작업을 요청할 때 사용한다.ex) create, update, delete (C,U,D)mutationFnpromise 처리가 이루어지는 mutation functionaxios를 이용하여 서버에 API를 요청하는 부분muta

펀딩 개설 페이지에 들어가는 인풋폼에 styled-components를 사용하고 있는데, input onChange가 일어나면 focus가 아웃되는 문제가 발생하여 해결 방법을 적어보려고 한다! 문제 상황 요렇게 정상적으로 숫자 or 텍스트 입력이 되는 것이 일반

펀딩 개설 페이지를 구현하는 도중 입력 필드가 많아져 상태관리의 필요성을 느꼈고, 무엇보다 gift item list에 dnd-kit(드래그앤드롭)를 붙였더니 끔찍한 리렌더링 이슈가 발생했다.02언니와 생각해본 해결 방법은 총 두 가지다.전역상태관리 (Recoil)Re