Adding dev environments for Astro

astro/README

@@ -0,0 +1,63 @@
+## Compose sample 
+### Astro service
+
+Project structure:
+```
+.
+├── app
+│   ├── Dockerfile
+│   ├── ...
+│   ├── ...
+│   ....
+└── compose.yaml
+```
+
+[_compose.yaml_](compose.yaml)
+```
+services:
+  app:
+    build: 
+      context: app
+      dockerfile: Dockerfile
+    volumes:
+      - ./app:/app
+      - /app/node_modules
+    ports:
+      - 4321:4321
+    ...
+
+```
+The compose file defines an application with one service `app`. The image for the Astro service is built with the Dockerfile inside the `app` directory (build parameter).
+
+When deploying the application, docker compose maps the container port 4321 to the same port on the host as specified in the file and runs the service listening for connections on that port.
+
+
+## Deploy with docker compose
+
+```
+$ docker compose up -d
+[+] Building 32.7s (11/11) FINISHED
+ => [app internal] load build definition from Dockerfile
+ => => transferring dockerfile: 229B
+ => [app internal] load metadata for docker.io/library/node:bookworm-slim
+ => [app internal] load .dockerignore
+ => => transferring context: 104B
+ => [app 1/5] FROM docker.io/library/node:bookworm-slim@sha256:0419dfdd085a0e6e52921b8ba952ea8c3317d7e0382a16c63b
+...
+...
+[+] Running 2/2
+ ✔ Network astro_default  Created
+ ✔ Container astro-app-1  Started
+```
+
+## Expected result
+
+Listing containers must show a container running and the port mapping as below:
+```
+$ docker compose ps
+NAME          IMAGE       COMMAND                  SERVICE   CREATED          STATUS          PORTS
+astro-app-1   astro-app   "docker-entrypoint.s…"   app       47 seconds ago   Up 46 seconds   0.0.0.0:4321->4321/tcp
+
+```
+
+After the application starts, navigate to `http://localhost:4321` in your web browser.

astro/app/.dockerignore

@@ -0,0 +1,3 @@
+.DS_Store
+node_modules
+dist

astro/app/Dockerfile

@@ -0,0 +1,14 @@
+FROM node:bookworm-slim AS runtime
+WORKDIR /app
+
+COPY package.json ./
+RUN npm install
+
+COPY . .
+
+RUN npm run build
+
+ENV HOST=0.0.0.0
+ENV PORT=4321
+EXPOSE 4321
+CMD npm run dev

astro/app/README.md

@@ -0,0 +1,47 @@
+# Astro Starter Kit: Minimal
+
+```sh
+npm create astro@latest -- --template minimal
+```
+
+[![Open in StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/withastro/astro/tree/latest/examples/minimal)
+[![Open with CodeSandbox](https://assets.codesandbox.io/github/button-edit-lime.svg)](https://codesandbox.io/p/sandbox/github/withastro/astro/tree/latest/examples/minimal)
+[![Open in GitHub Codespaces](https://github.com/codespaces/badge.svg)](https://codespaces.new/withastro/astro?devcontainer_path=.devcontainer/minimal/devcontainer.json)
+
+> 🧑‍🚀 **Seasoned astronaut?** Delete this file. Have fun!
+
+## 🚀 Project Structure
+
+Inside of your Astro project, you'll see the following folders and files:
+
+```text
+/
+├── public/
+├── src/
+│   └── pages/
+│       └── index.astro
+└── package.json
+```
+
+Astro looks for `.astro` or `.md` files in the `src/pages/` directory. Each page is exposed as a route based on its file name.
+
+There's nothing special about `src/components/`, but that's where we like to put any Astro/React/Vue/Svelte/Preact components.
+
+Any static assets, like images, can be placed in the `public/` directory.
+
+## 🧞 Commands
+
+All commands are run from the root of the project, from a terminal:
+
+| Command                   | Action                                           |
+| :------------------------ | :----------------------------------------------- |
+| `npm install`             | Installs dependencies                            |
+| `npm run dev`             | Starts local dev server at `localhost:4321`      |
+| `npm run build`           | Build your production site to `./dist/`          |
+| `npm run preview`         | Preview your build locally, before deploying     |
+| `npm run astro ...`       | Run CLI commands like `astro add`, `astro check` |
+| `npm run astro -- --help` | Get help using the Astro CLI                     |
+
+## 👀 Want to learn more?
+
+Feel free to check [our documentation](https://docs.astro.build) or jump into our [Discord server](https://astro.build/chat).

astro/app/astro.config.mjs

@@ -0,0 +1,15 @@
+import { defineConfig } from 'astro/config';
+import tailwind from "@astrojs/tailwind";
+
+// https://astro.build/config
+export default defineConfig({
+  integrations: [tailwind()],
+  vite: {
+    server:{
+      host: "0.0.0.0",
+      hmr: { clientPort: 4321 },
+      port: 4321, 
+      watch: { usePolling: true }
+    }
+  }
+});

astro/app/package.json

@@ -0,0 +1,17 @@
+{
+  "name": "astro",
+  "type": "module",
+  "version": "0.0.1",
+  "scripts": {
+    "dev": "astro dev --host 0.0.0.0",
+    "start": "astro dev",
+    "build": "astro build",
+    "preview": "astro preview",
+    "astro": "astro"
+  },
+  "dependencies": {
+    "@astrojs/tailwind": "^5.1.0",
+    "astro": "^4.13.1",
+    "tailwindcss": "^3.4.8"
+  }
+}

astro/app/src/env.d.ts

@@ -0,0 +1 @@
+/// <reference types="astro/client" />

astro/app/src/pages/index.astro

@@ -0,0 +1,16 @@
+---
+
+---
+
+<html lang="en">
+	<head>
+		<meta charset="utf-8" />
+		<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
+		<meta name="viewport" content="width=device-width" />
+		<meta name="generator" content={Astro.generator} />
+		<title>Astro</title>
+	</head>
+	<body>
+		<h1>Astro</h1>
+	</body>
+</html>

astro/app/tailwind.config.mjs

@@ -0,0 +1,8 @@
+/** @type {import('tailwindcss').Config} */
+export default {
+	content: ['./src/**/*.{astro,html,js,jsx,md,mdx,svelte,ts,tsx,vue}'],
+	theme: {
+		extend: {},
+	},
+	plugins: [],
+}

astro/app/tsconfig.json

@@ -0,0 +1,3 @@
+{
+  "extends": "astro/tsconfigs/base"
+}

astro/compose.yaml

@@ -0,0 +1,13 @@
+services:
+  app:
+    build: 
+      context: app
+      dockerfile: Dockerfile
+    volumes:
+      - ./app:/app
+      - /app/node_modules
+    ports:
+      - 4321:4321
+    environment:
+      - HOST=0.0.0.0
+      - PORT=4321