# React

astia

함수 1번(counterUP) / 함수 2번(render) / 함수 3번(Container)

sam334

1. 학습내용 오늘은 리덕스(redux)에 관해 잠깐 배워보았다. -javaScript 상태관리 라이브러리 • Node.js 모듈 • 상태관리 툴 종류 React Context Redux Mobx 상태관리의 필요성 • 상태관리 React에서 State는 compon

acwell94

리액트가 업데이트 되면서 나온 개념대부분 개발할 때 사용함생성자 단계에서 state를 정의해서 사용하고 setState()함수를 통해 state를 업데이트할 수 있으며 Lifecycle methods를 제공함클래스 컴포넌트의 state 사용이 불가하며 Lifecycle

eunnbi

🐽 모아모아 프로젝트를 하면서 어떤 리액트 컴포넌트 패턴을 사용할지에 대한 고민을 많이 했다. 그 과정에서 배운 내용들을 정리해보려고 한다. ⚛️ React Component Pattern React는 개발자가 자유롭게 컴포넌트를 짤 수 있기 때문에, 다양한 패턴

awesomee

ternary operator-null / style / props / useState

eunnbi

👉 컴포넌트, 다시 생각하기 영상을 보고 정리한 내용입니다. React 컴포넌트의 의존성 파악하기 💅 스타일 css, scss, css-in-js 등등 🪝 로직 UI 조작에 필요한 커스텀 로직 custom hook 🌐 전역 상태 현재 UI를 표현하기 위해

ih9137

Redux를 조금 더 쉽게 사용하기 위해 만든 Redux-toolkit에 대해 알아보려고 한다. 일단은 npm으로 Redux-toolkit을 다운로드 한다. 그리고 메인이 되는 파일(app.jsx 또는 app.tsx)로 가서 아래와 같이 코드를 추가해준다. store 내에 파일은 아래와 같이 구성하면 된다. 위 소스에 대해 설명을 하자면 아래와 같다...

lize

Node.js 설치npm 또는 yarn 설치코드 에디터 설치 Git 설치create-react-app으로 프로젝트 만들기리액트 프로젝트를 만들 때는 반드시 Node.js를 먼저 설치해야 한다.Node.js는 자바스크립트 런타임으로, 크롬 V8 자바스크립트 엔진으로 빌드

lize

리액트의 주요 특징은 Virtual DOM을 사용하는 것.DOM은 Document Object Model의 약어이고객체로 문서 구조를 표현하는 방법이다.웹브라우저는 DOM을 활용하여 객체에 자바스크립트와 CSS를 적용한다.DOM은 트리형태라서 특정 노드를 찾거나 수정하

lize

자바스크립트는 현재 웹 애플리케이션에서 가장 핵심적인 역할을 한다.더 나아가 영역을 확장하여 서버 사이드는 물론 모바일, 데스크톱 애플리케이션에서도 엄청나게 활약한다.이제 자바스크립트만으로도 규모가 큰 애플리케이션을 만들 수 있는 시대가 왔다.대규모 애플리케이션 중 프

ckdwns9121

프로젝트 수정할 것이 있어 오랜만에 git clone을 하고 node_modules를 설치한 뒤 yarn start를 했더니 아래와 같은 에러가 떴다.웹팩 버전 안맞어보아하니 웹팩 버전이 안맞는것 같은데... 웹팩 버전이 맞지않는 이슈는 처음이라 해결방법을 찾아보기로

astia

1번과 2번은 같은 함수가 된다. 1번에 함수로 정의해주어 리턴값을 반환한다면 2번에선 일반변수가 =() => 들어가면 함수로 바뀐다.

astia

바벨 임폴트 추가"https://unpkg.com/@babel/standalone/babel.min.js"원래 썼던 코드방식에서 createElement를 쓰지않고 더욱 편하게 만든는 법똑같이 잘 작동한다

leyuri

[React] saga 설치하고 generator 이해하기

gene028

React를 이용하여 간단한 익명게시판을 만들어보자.익명게시판에서 지원하는 기능은 다음과 같다.Dark ModeDark Mode와 Light Mode 조건부 렌더링 UI 구현LoadingLoading True : 로딩중일 경우, 로딩 이미지를 띄운다.Loaindg Fa

beberiche

React ForwardRef 이해하기

geonhee

이 글은 을 참고하여 작성하였습니다.정리 느낌으로 작성하였으므로 내용이 정확하지 않고 구체적이지 않을 수 있습니다. !스토리북 생략 CSS로 컴포넌트 스타일 적용하기 CDN 방식,파일 방식으로 머티리얼 디자인 적용하기 머티리얼 디자인:구글 디자인 가이드 CDN:

weesemoa

React에서 Font Awesome을 사용해 보자!여러 icon package를 한꺼번에 받으려면 아래처럼 쓸 수 있다. 사용을 원하는 component에서 Font Awesome을 react component 형태로 사용하기 위한 패키지를 import를 해주자.마

yhnb3

React 레퍼런스는 useRef를 다음과 같이 정의 하고 있습니다.useRef는 .current 프로퍼티로 전달된 인자(initialValue)로 초기화된 변경 가능한 ref 객체를 반환합니다. 반환된 객체는 컴포넌트의 전 생애주기를 통해 유지될 것입니다.그럼 다음과

khy226

본 게시글은 useEffect 완벽 가이드를 정리 & 요약하는 글입니다.