[Legacy][React] React 기초 및 개념

[React] React 기초 및 개념

React에 대해서 간단하게 알아보려고 한다. React 공식 홈페이지에서는 React를 다음과 같이 설명하고 있다. 사용자 인터페이스를 만들기 위한 JavaScript 라이브러리. React를 학습하여 보다 더 사용자 인터페이스에 좋고, 빠르고, 효율적으로 웹 페이지를 구현할 수 있도록 해보자.

React 학습 순서 (개인적인 생각)

여기서 말하는 React는 class 기반이 아닌 함수형 hook을 말하는 것이다.

• 1. CRA (create-react-app)을 이용하여 react 프로젝트 만들어보기
• 2. React state 란?
• 3. React useRef 란?
• 4. React useEffect란?, React hook 라이프 사이클
• 5. 간단한 개인 프로젝트 진행
• 6. React useMemo, useCallback이란?
• 7. forwardRef, React useRef에 이런 것도?
• 8. React useContext, useReducer
• 9. 개인 프로젝트 진행

위 순서대로 하면 어느 정도 React에 대한 이해를 갖출 수 있다고 생각한다. 위 숫자들은 그냥 순서의 의미이지, 10개의 게시글이 올라간다는 뜻은 아니다. 예를들어 useEffect에 설명이 길어지면, 해당 개념에 대한 게시글이 2,3개 올라갈 수도 있다. 게시글 작성 중간중간에 위 순서가 아닌 추가로 알아야 하는 것들도 업로드할 예정이고 간단하게 구현해 볼 수 있는 것들은 추가할 것이다. 추가로 알아야 하는 것들은 아래 리스트를 참고해서 확인해보자.

추가로 알아야 하는 것

우선 간단하게 생각나는 것은 아래 3가지 정도가 있고 하다보면서 더 추가할 수도 있다.

• 1. React 프로젝트에서 절대 경로 지정하기
• 2. React 프로젝트에 css 적용하는 방법
• 3. React 프로젝트에서 환경변수 사용하기

정리

위에 작성한 개념들은 모두 다룰 것이고 상세히 다룰 수 있을지는 모르겠다. (사실 내가 아는 것이 전부 정확하다고 장담은 못 한다.) 그래도 위 개념을 정확히 습득하게 된다면 개인이 원하는 프로젝트를 모르는 것을 검색하면서 할 수 있다라는 생각을 한다.

마지막

해당 내용은 틀릴 수도 있다는 것을 감안하여 봐주세요. 틀린 내용 및 오탈자 수정 요청 환영입니다.