Skip to content

Commit

Permalink
astro: add dev envs config for astro
Browse files Browse the repository at this point in the history
Signed-off-by: Edoardo Dusi <[email protected]>
  • Loading branch information
edodusi committed Aug 8, 2024
1 parent 18f59bd commit 6868f58
Show file tree
Hide file tree
Showing 12 changed files with 209 additions and 0 deletions.
63 changes: 63 additions & 0 deletions astro/README
Original file line number Diff line number Diff line change
@@ -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.
3 changes: 3 additions & 0 deletions astro/app/.dockerignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
.DS_Store
node_modules
dist
14 changes: 14 additions & 0 deletions astro/app/Dockerfile
Original file line number Diff line number Diff line change
@@ -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
47 changes: 47 additions & 0 deletions astro/app/README.md
Original file line number Diff line number Diff line change
@@ -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).
15 changes: 15 additions & 0 deletions astro/app/astro.config.mjs
Original file line number Diff line number Diff line change
@@ -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 }
}
}
});
17 changes: 17 additions & 0 deletions astro/app/package.json
Original file line number Diff line number Diff line change
@@ -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"
}
}
9 changes: 9 additions & 0 deletions astro/app/public/favicon.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
1 change: 1 addition & 0 deletions astro/app/src/env.d.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
/// <reference types="astro/client" />
16 changes: 16 additions & 0 deletions astro/app/src/pages/index.astro
Original file line number Diff line number Diff line change
@@ -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>
8 changes: 8 additions & 0 deletions astro/app/tailwind.config.mjs
Original file line number Diff line number Diff line change
@@ -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: [],
}
3 changes: 3 additions & 0 deletions astro/app/tsconfig.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
{
"extends": "astro/tsconfigs/base"
}
13 changes: 13 additions & 0 deletions astro/compose.yaml
Original file line number Diff line number Diff line change
@@ -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

0 comments on commit 6868f58

Please sign in to comment.