React를 공부하면서 필수적으로 알아야 할 것?

내가 React 개발자가 되기 위해 길을 잃지 않기 위해서 꼭 알아야 하는 기본 지식들을 써보자.

 

1. React의 기본 개념 및 필수 지식

 

React 개발자로서 기본적인 이해를 갖춰야 할 것들입니다:

• JSX: HTML과 JavaScript가 혼합된 문법을 이해하고 작성할 수 있어야 합니다.

• 컴포넌트:

• 함수형 컴포넌트와 클래스형 컴포넌트 차이 이해

• 컴포넌트 재사용성과 컴포넌트 라이프사이클 관리

• Props와 State:

• Props를 통한 데이터 전달과 컴포넌트 간의 데이터 흐름

• State를 통해 동적인 UI를 관리

• React Hooks:

• useState, useEffect는 반드시 이해하고 활용할 수 있어야 합니다.

• 추가로 useContext, useReducer, useMemo도 학습 권장

• React Router:

• SPA(싱글 페이지 애플리케이션)에서 라우팅을 처리하는 방법

• Forms & Controlled Components:

• 사용자 입력 폼 처리 및 데이터 제어

 

2. 프론트엔드 개발자로서 필수적인 스킬

 

React와 함께 다음 기술에 대한 이해도 필수입니다:

• JavaScript (ES6 이상):

• map, filter, reduce 등 배열 메서드

• 비동기 처리 (async/await, Promise)

• 구조 분해 할당 및 스프레드 연산자

• CSS:

• CSS-in-JS (예: styled-components, Emotion) 또는 Tailwind CSS 같은 유틸리티 프레임워크

• 반응형 디자인과 Media Queries

• TypeScript:

• React 프로젝트에 TypeScript를 도입하여 안정성을 높이는 방법

• 패키지 관리:

• npm 또는 Yarn을 이용한 라이브러리 설치 및 관리

 

3. React 개발자로서 알아야 할 필수 도구와 라이브러리

• State Management:

• React Context API (기본 상태 관리)

• Redux 또는 Zustand 같은 라이브러리

• API 통신:

• Fetch API 및 Axios 사용법

• RESTful API 및 GraphQL 기본 개념

• 버전 관리 도구:

• Git과 GitHub 기본 사용법

• 코드 리뷰 워크플로우

• 테스트:

• React Testing Library 또는 Jest를 이용한 컴포넌트 테스트

 

4. 시드니에서 React 취업을 위한 추가 준비

• 포트폴리오 준비:

• React로 만든 프로젝트 최소 2~3개를 준비 (e.g., 간단한 CRUD 웹앱, API 기반 프로젝트 등).

• 프로젝트에서 사용한 기술 스택과 해결한 문제를 명확히 설명할 수 있도록 준비.

• 실무적인 React 사용:

• 실제 서버에서 데이터를 불러와 상태를 관리하고 화면에 표시하는 전반적인 프로세스 경험.

• CI/CD:

• Netlify, Vercel 같은 서비스로 프로젝트를 배포해 본 경험.

• 기술 면접 준비:

• React에서 자주 묻는 질문들 (e.g., React의 가상 DOM, hooks 작동 방식, 성능 최적화 방법) 대비.

 

5. React에서 꼭 알아야 하는 개념들

• 리액트의 가상 DOM:

• 가상 DOM이 무엇이고, 어떻게 작동하며, 실제 DOM과의 차이점.

• 상태와 렌더링:

• 상태 변경이 렌더링에 미치는 영향.

• 성능 최적화:

• React.memo, useMemo, useCallback의 사용법.

• Lazy Loading과 코드 스플리팅.

• 에러 핸들링:

• React Error Boundaries 사용.