stackbuilder/node-frontend
Node unversal frontend
56
stackbuilder/node-frontend repository overview
ā š³ Node Frontend Universal Image
-green?style=flat-square){kind=icon}
Universal Node.js image untuk frontend framework populer:
- ā React (CRA, Vite)
- ā Vue.js (CLI, Vite)
- ā Next.js
- ā Nuxt.js
ā š Fitur Utama
- Node.js LTS 24 (Alpine) ā ringan & cepat
- Sudah ada bash, git, curl
- Mendukung development & production mode
- Default expose port 3000
- Multi-arch support:
linux/amd64,linux/arm64(Mac M1/M2 friendly)
ā ā Cara Pull Image
docker pull stackbuilder/node-frontend:24-alpine
ā ā Cara Pakai
š¹ Development Mode (Hot Reload)
Gunakan untuk React, Vue, Next.js, Nuxt.js:
docker run -it --rm \
-v $(pwd):/app \
-w /app \
-p 3000:3000 \
stackbuilder/node-frontend:24-alpine \
npm run dev
š¹ Production Mode
Build dan serve aplikasi:
docker run -it --rm \
-v $(pwd):/app \
-w /app \
-p 3000:3000 \
-e NODE_ENV=production \
stackbuilder/node-frontend:24-alpine \
sh -c "npm install && npm run build && npm run start"
ā ā Contoh docker-compose.yml
Development
version: "3.9"
services:
app:
image: stackbuilder/node-frontend:24-alpine
container_name: node-frontend
working_dir: /app
volumes:
- .:/app
- /app/node_modules
ports:
- "3000:3000"
environment:
- NODE_ENV=development
command: npm run dev
Production
version: "3.9"
services:
app:
image: stackbuilder/node-frontend:24-alpine
container_name: node-frontend
working_dir: /app
volumes:
- .:/app
ports:
- "3000:3000"
environment:
- NODE_ENV=production
command: sh -c "npm install && npm run build && npm run start"
ā ā Contoh Penggunaan untuk Framework
React (Vite)
docker run -it --rm \
-v $(pwd):/app \
-w /app \
-p 3000:3000 \
stackbuilder/node-frontend:24-alpine \
npm run dev -- --host
Vue (Vite)
docker run -it --rm \
-v $(pwd):/app \
-w /app \
-p 5173:5173 \
stackbuilder/node-frontend:24-alpine \
npm run dev -- --host
Next.js
docker run -it --rm \
-v $(pwd):/app \
-w /app \
-p 3000:3000 \
stackbuilder/node-frontend:24-alpine \
npm run dev
Nuxt.js
docker run -it --rm \
-v $(pwd):/app \
-w /app \
-p 3000:3000 \
stackbuilder/node-frontend:24-alpine \
npm run dev
ā ā Multi-arch Build (AMD64 + ARM64)
Jalankan perintah ini untuk build image dengan dukungan multi-architecture:
docker buildx create --use
docker buildx build --platform linux/amd64,linux/arm64 \
-t stackbuilder/node-frontend:24-alpine \
--push .
ā ā Best Practice
ā Development
Mount source code: .:/app agar hot reload berjalan
Tambahkan volume untuk node_modules: - /app/node_modules agar tidak konflik dengan host
ā Production
Gunakan NODE_ENV=production
Jalankan npm ci untuk instalasi cepat dan konsisten
Pertimbangkan docker-compose.override.yml untuk mode berbeda
š Image ini dibuat untuk mempermudah developer frontend menjalankan proyek di container tanpa setup manual Node.js.
Tag summary
Content type
Image
Digest
sha256:ec56be700ā¦
Size
63.1 MB
Last updated
about 1 year ago
docker pull stackbuilder/node-frontend:24-alpine