• 회사에서 FSD 아키텍처 설계를 공부하는 중
  • 이건 대형 프로젝트에 적합

아래에 사이트를 참고하여 소형 사이트(내 포트폴리오)파일을 구성할 예정

참고용이지 그대로 하진 않을 것,

현재 작업중인 내 환경은 최신화 되어있음. 설명 사이트는 버전이 좀 지난걸 참고 ~

1. React 폴더 정리하기

- node_modules
- public
	ㄴ favicon.svg
	ㄴ index.html
- src
	ㄴ assets
	ㄴ App.js
	ㄴ index.js 
- .gitignore
- package-lock.josn
- package.josn
- README.md
출처: <https://webstoryboy.co.kr/1934> [WEBSTORYBOY:티스토리]

• node_modules: 이 폴더는 프로젝트에서 사용하는 외부 라이브러리와 모듈들이 저장되는 곳입니다. 이 폴더는 개발자가 직접 생성하지 않고, 프로젝트에 필요한 패키지들을 자동으로 설치했을 때 생성됩니다. 일반적으로 npm 또는 yarn과 같은 패키지 매니저를 통해 필요한 패키지들을 설치하면 자동으로 생성됩니다.
• public: 이 폴더는 웹 애플리케이션의 루트(root) 폴더입니다. 여기에 있는 파일들은 브라우저에서 직접 접근 가능합니다. 이 폴더에는 주로 HTML 파일, 이미지 파일, 파비콘(favicon)과 같은 리소스 파일들이 위치합니다.
• favicon.svg: 파비콘(favicon)은 웹사이트의 탭에 표시되는 작은 아이콘을 의미합니다. 일반적으로 이 파일은 웹사이트를 대표하는 아이콘이나 로고 이미지를 담고 있습니다.
• index.html: 이 파일은 리액트 애플리케이션의 진입점(entry point)이 되는 HTML 파일입니다. 웹 브라우저가 이 파일을 로드하면, 리액트 애플리케이션의 컴포넌트들이 렌더링되는 루트(root) 요소를 지정합니다.
• src: 소스 코드를 포함하는 폴더로, 리액트 애플리케이션의 주요 코드가 이곳에 위치합니다. 주로 컴포넌트들, 스타일 시트, 그리고 기타 자바스크립트 파일들이 이 폴더에 저장됩니다.
• assets: 리액트 애플리케이션에서 사용되는 정적 파일들을 저장하는 폴더입니다. 주로 이미지, 폰트, 그래픽 등이 이곳에 위치합니다.
• App.js: 이 파일은 리액트 애플리케이션의 최상위 컴포넌트인 'App' 컴포넌트를 정의하는 파일입니다. 애플리케이션의 다른 컴포넌트들은 이 'App' 컴포넌트 내부에 렌더링되거나 포함될 수 있습니다.
• index.js: 이 파일은 리액트 애플리케이션의 다른 컴포넌트들을 실제 DOM에 렌더링하는 역할을 합니다. 주로 'ReactDOM.render()' 메서드를 통해 'App' 컴포넌트를 실제 DOM에 마운트(mount)합니다.
• .gitignore: Git 버전 관리에서 무시해야 하는 파일과 폴더들을 지정하는 파일입니다. 보통 'node_modules' 폴더와 빌드 결과물 등은 버전 관리에서 제외하고 싶은 경우 이 파일에 명시합니다.
• package-lock.json: Node.js 프로젝트에서 사용되는 패키지의 의존성을 관리하는 파일입니다. 패키지들 간의 의존성과 버전 정보가 기록되어 있어, 다른 환경에서 프로젝트를 다시 설치하거나 빌드할 때 일관성을 유지하는 데 도움을 줍니다.