각 프레임워크 공홈 권장 세팅 직후 폴더구조 정리
공홈 권장 세팅 직후 폴더구조
Vanilla JS, Nodejs, React, Nextjs, Spring
1) JS (브라우저 순수, 번들러/Node 없음)
vanilla-web/ # 런타임=브라우저
├─ index.html # 진입점(브라우저가 직접 연다)
└─ src/
└─ main.js # 브라우저가 직접 실행하는 스크립트(ESM 가능)2) Node.js (패키지 매니저 포함, 번들러 없음)
node-app/ # 런타임=Node
├─ package.json # 메타/스크립트/의존성
├─ package-lock.json # (npm 사용 시) 잠금파일
├─ node_modules/ # 설치된 패키지들(.bin 포함)
└─ src/
└─ index.js # Node 실행 엔트리3) React (CDN/번들러 없이 최소 형태) ※ Vite/Next는 아래에 별도
react-cdn/ # 빌드 없이 브라우저에서 바로 로딩
├─ index.html # <script>로 React/ReactDOM CDN 로드
└─ app.js # React 컴포넌트/렌더 코드4) Next.js (App Router 기본)
next-app/
├─ package.json # 스크립트: dev/build/start/lint 등
├─ next.config.mjs # Next 설정 [확실하지 않음: .js/.mjs/ts 가능]
├─ tsconfig.json # TS 선택 시 생성
├─ .eslintrc.json # ESLint [확실하지 않음: 버전에 따라 다름]
├─ .gitignore
├─ public/ # 정적 파일(파비콘 등)
├─ src/ # [확실하지 않음: create 옵션에 따라 app/가 루트일 수도]
│ └─ app/ # App Router 디렉터리
│ ├─ layout.tsx # 루트 레이아웃
│ ├─ page.tsx # 루트 페이지
│ └─ globals.css # 전역 스타일(보통 src/app에 위치)
└─ README.md # 자동 생성 안내 문서5) Spring Boot (Maven 예시)
spring-boot-app/
├─ pom.xml # Maven 빌드 스크립트
├─ src/
│ ├─ main/
│ │ ├─ java/
│ │ │ └─ com/example/demo/
│ │ │ └─ DemoApplication.java # @SpringBootApplication 엔트리
│ │ └─ resources/
│ │ ├─ application.properties # 설정(또는 application.yml)
│ │ ├─ static/ # 정적 리소스(선택)
│ │ └─ templates/ # Thymeleaf 등 템플릿(선택)
│ └─ test/
│ └─ java/
│ └─ com/example/demo/
│ └─ DemoApplicationTests.java # 기본 테스트
└─ .gitignore6) JSP (전통적 WAR 구조, Servlet 컨테이너용)
jsp-webapp/
├─ pom.xml # Maven(또는 build.gradle)
├─ src/
│ └─ main/
│ ├─ java/ # 서블릿/필터 등 자바 소스
│ └─ webapp/
│ ├─ WEB-INF/
│ │ └─ web.xml # 배포 서술자(구성에 따라 생략 가능) [확실하지 않음]
│ ├─ index.jsp # JSP 뷰
│ └─ views/ # 추가 JSP들(선택)
└─ .gitignore7) Vite (Vanilla 템플릿)
vite-vanilla/
├─ package.json # scripts: dev/build/preview
├─ index.html # 개발서버가 그대로 서빙
├─ src/
│ ├─ main.js # 엔트리(ESM)
│ └─ style.css # 기본 스타일
├─ node_modules/
└─ vite.config.ts # [확실하지 않음: 기본 생성 시 없을 수도]8) Rust (Cargo – 바이너리 크레이트)
rust-cli/
├─ Cargo.toml # 패키지 메타/의존성
├─ src/
│ └─ main.rs # 엔트리(fn main)
└─ .gitignore # 기본 생성라이브러리 크레이트는
src/lib.rs가 생성됨(명령:cargo new my-lib --lib).
9) Tauri (+ Vite + React 예시)
tauri-app/
├─ package.json # 프런트엔드(React/Vite) 스크립트/의존성
├─ index.html # Vite 엔트리(템플릿에 따라 src/main.tsx로 연결)
├─ src/
│ ├─ main.tsx # React 엔트리
│ └─ App.tsx # 루트 컴포넌트
├─ src-tauri/ # 네이티브(Tauri) 파트
│ ├─ tauri.conf.json # 앱 메타/권한/업데이트 설정
│ ├─ Cargo.toml # Rust 크레이트 메타
│ └─ src/
│ └─ main.rs # Tauri commands/IPC 등록, 앱 윈도우 생성
├─ node_modules/
└─ vite.config.ts # 프런트 빌드 설정10) Electron (최소 구조)
electron-app/
├─ package.json # "main": "main.js" (메인 프로세스 엔트리)
├─ main.js # 메인 프로세스(브라우저윈도우 생성)
├─ preload.js # 프리로드(IPC 브릿지) [확실하지 않음: 선택]
├─ renderer/ # 렌더러(브라우저 창 콘텐츠)
│ ├─ index.html
│ └─ renderer.js
└─ node_modules/
치킨강정