React를 처음 시작하면 프로젝트를 만든 직후부터 바로 헷갈리는 부분이 있습니다. 바로 폴더 구조입니다.특히 입문자 입장에서는 아래 질문이 자주 나옵니다.`src` 폴더에는 무엇을 넣는가?`public` 폴더는 언제 사용하는가?`components` 폴더는 왜 따로 나누는가?파일을 아무 데나 두면 안 되는 이유는 무엇인가?이번 글에서는 React 입문자가 가장 먼저 이해해야 하는 src, public, components 폴더 역할을 한 번에 정리해보겠습니다. 단순히 폴더 이름만 설명하는 것이 아니라, 왜 그렇게 나누는지, 실제로 어떻게 관리하는지까지 함께 보겠습니다.핵심만 먼저 보면src는 실제 React 코드가 들어가는 핵심 폴더입니다.public은 정적 파일을 그대로 제공할 때 사용하는 영역입니다..
React를 처음 시작할 때 가장 먼저 막히는 구간은 문법이 아니라 개발환경 세팅입니다.특히 입문자 입장에서는 아래가 한 번에 헷갈리기 쉽습니다.Node.js는 왜 설치해야 하는가?npm은 무엇이고 같이 설치되는가?React 프로젝트는 어떤 명령어로 시작하는가?생성한 프로젝트는 어떻게 실행하는가?이번 글에서는 React를 처음 시작하는 분 기준으로 Node.js 설치 → 버전 확인 → React 프로젝트 생성 → 개발 서버 실행까지 한 번에 따라갈 수 있도록 정리하겠습니다.핵심만 먼저 보면React 개발환경 세팅의 핵심은 Node.js 설치, 패키지 매니저 확인, Vite로 프로젝트 생성, 개발 서버 실행입니다.728x90왜 Node.js부터 설치해야 할까?React 자체보다 먼저 필요한 기반 도구가 있..
프론트엔드 공부를 시작하면 가장 먼저 자주 보게 되는 이름이 바로 React입니다. 채용 공고에서도 많이 보이고, 실무 프로젝트에서도 널리 쓰이며, 입문자가 처음 접하기 좋은 대표 프론트엔드 도구이기도 합니다.하지만 처음에는 아래처럼 헷갈리기 쉽습니다.React는 정확히 무엇인가?JavaScript와는 무엇이 다른가?왜 많은 서비스가 React를 사용하는가?React를 배우면 실제로 무엇이 편해지는가?이번 글에서는 React를 처음 접하는 분들도 흐름이 한 번에 잡히도록 쉬운 정의 → 왜 중요한가 → 핵심 특징 → 장점 → 왜 사용하는가 → 예제 → 실무 포인트 순서로 정리하겠습니다.핵심만 먼저 보면React는 사용자 인터페이스(UI)를 컴포넌트 단위로 나누어 만들고, 상태 변화에 따라 화면을 효율적으로..