Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

update static site docs with http_service, new nginx example #1827

Merged
merged 5 commits into from
Sep 17, 2024
Merged

update static site docs with http_service, new nginx example #1827

Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
e234790
update static site docs with http_service, new nginx example
jphenow Sep 17, 2024
479e920
some last updates
jphenow Sep 17, 2024
86fa349
lowercase nginx
jphenow Sep 17, 2024
3273301
maybe maybe
jphenow Sep 17, 2024
4db2552
woops
jphenow Sep 17, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
181 changes: 147 additions & 34 deletions languages-and-frameworks/static.html.markerb
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,13 +4,9 @@ layout: language-and-framework-docs
redirect_from: /docs/getting-started/static/
---

<%= partial "/docs/partials/obsolete_doc" %>

<%= partial "partials/intro", locals: { runtime: "static", type: "site" } %>

To be fair, a static site isn't an app. So we're really talking about **deploying an app to serve some static content.**

In this demonstration, we'll use [goStatic](https://github.com/PierreZ/goStatic), a tiny web server written in Go that lets us serve static files with very little configuration. We'll provide a Dockerfile and our content for Fly to transmogrify into a web server running in a VM.
In this demonstration, we'll use [nginx](https://nginx.org), the world's most popular web server to serve a few static files with very little configuration. We'll provide a Dockerfile and our content for Fly to transmogrify into a web server running in a VM.

You can clone all the files needed for this example from [the hello-static GitHub repository](https://github.com/fly-apps/hello-static) to a local directory:

Expand Down Expand Up @@ -38,9 +34,9 @@ cd hello-static

### _The Site_

Our example will be a simple static site. That can be as trivial as a single `index.html` file. Let's make it only slightly more complicated by writing two html files and having them link to each other.
Our example will be a simple static site. That can be as trivial as a single `index.html` file. Let's make it only slightly more complicated by writing two HTML files and having them link to each other.

Put these html files into a subdirectory of their own, called `public`. Files in this directory are the ones our goStatic server will serve. Create the `hello-static/public` directory if needed.
Put these HTML files into a subdirectory of their own, called `public`. Files in this directory are the ones our nginx server will serve. Create the `hello-static/public` directory if needed.

Here's `index.html`, which is the landing page:

Expand Down Expand Up @@ -69,22 +65,23 @@ Here's `goodbye.html`.
</head>
<body>
<h1>You say goodbye</h1>
<p>But I say <a href="index.html">hello.</a></p>
<p>But I say <a href="/">hello.</a></p>
</body>
</html>
```

### _The Dockerfile_

goStatic is designed to run in a container, and the [image](https://hub.docker.com/r/pierrezemb/gostatic) is available at Docker Hub. This is super convenient for us, because Fly apps need container images too!
nginx can be run in a container, and the official nginx image is available on [Docker Hub](https://hub.docker.com/_/nginx/). This is super convenient for us, because Fly apps use container images!

We can use the goStatic image as a base image. We just have to copy our site's files to `/srv/http/` in the image.
We can use the nginx image as a base image. We just have to copy our site's files to `/usr/share/nginx/html` in the image.

Here's our Dockerfile to do that:

```docker
FROM pierrezemb/gostatic
COPY ./public/ /srv/http/
FROM nginx:alpine

COPY public /usr/share/nginx/html
```

The Dockerfile should be placed in the working directory (here, `hello-static`).
Expand All @@ -100,30 +97,99 @@ The `hello-static` repository contains a `fly.toml` that will be detected by `fl
flyctl launch
```
```output
Creating app in /Users/chris/trystatic/hello-static
Scanning source code
Detected a Dockerfile app
? App Name (leave blank to use an auto-generated name): gostatic-example
Automatically selected personal organization: Chris Nicoll
? Select region: ewr (Secaucus, NJ (US))
Created app gostatic-example in organization personal
Creating app in /Users/jphenow/workspace/hello-static
We're about to launch your app on Fly.io. Here's what you're getting:

Organization: Jon Phenow (fly launch defaults to the personal org)
Name: hello-static (generated)
Region: Denver, Colorado (US) (this is the fastest region for you)
App Machines: shared-cpu-1x, 1GB RAM (most apps need about 1GB of RAM)
Postgres: <none> (not requested)
Redis: <none> (not requested)
Tigris: <none> (not requested)

? Do you want to tweak these settings before proceeding? No
Created app 'hello-static' in organization 'personal'
Admin URL: https://fly.io/apps/hello-static
Hostname: hello-static.fly.dev
Wrote config file fly.toml
? Would you like to setup a Postgresql database now? No
? Would you like to deploy now? No
Your app is ready. Deploy with `flyctl deploy`
Validating /Users/jphenow/workspace/hello-static/fly.toml
✓ Configuration is valid
==> Building image
Remote builder fly-builder-little-haze-7293 ready
Remote builder fly-builder-little-haze-7293 ready
==> Building image with Docker
--> docker host: 24.0.7 linux x86_64
[+] Building 0.4s (7/7) FINISHED
=> [internal] load .dockerignore 0.2s
=> => transferring context: 100B 0.2s
=> [internal] load build definition from Dockerfile 0.2s
=> => transferring dockerfile: 90B 0.2s
=> [internal] load metadata for docker.io/library/nginx:alpine 0.1s
=> [internal] load build context 0.1s
=> => transferring context: 151B 0.1s
=> [1/2] FROM docker.io/library/nginx:alpine@sha256:a5127daff3d6f4606be3100a252419bfa84fd6ee5cd74d0feaca1a5068f97dcf 0.0s
=> CACHED [2/2] COPY public /usr/share/nginx/html 0.0s
=> exporting to image 0.0s
=> => exporting layers 0.0s
=> => writing image sha256:1e96a09c0ae89bb9b8dc5dcdcfde700fb1ee2677c20dc9d5f324a5b768328dda 0.0s
=> => naming to registry.fly.io/hello-static:deployment-01J8071W7G3S6R2MC5JJX915CC 0.0s
--> Building image done
==> Pushing image to fly
The push refers to repository [registry.fly.io/hello-static]
deployment-01J8071W7G3S6R2MC5JJX915CC: digest: sha256:2ba357ed3fcf6eeb3a5e4c7a6e2300040cf6f414db69ce2e3b7d6030507deb5e size: 2196
--> Pushing image done
image: registry.fly.io/hello-static:deployment-01J8071W7G3S6R2MC5JJX915CC
image size: 43 MB

Watch your deployment at https://fly.io/apps/hello-static/monitoring

Provisioning ips for hello-static
Dedicated ipv6: 2a09:8280:1::46:a909:0
Shared ipv4: 66.241.124.149
Add a dedicated ipv4 with: fly ips allocate-v4

This deployment will:
* create 2 "app" machines

No machines in group app, launching a new machine

WARNING The app is not listening on the expected address and will not be reachable by fly-proxy.
You can fix this by configuring your app to listen on the following addresses:
- 0.0.0.0:8080
Found these processes inside the machine with open listening sockets:
PROCESS | ADDRESSES
---------------------------------------------*----------------------------------------
nginx: master process nginx -g daemon off; | 0.0.0.0:80, [::]:80
/.fly/hallpass | [fdaa:0:7300:a7b:d827:5e53:ee2d:2]:22
nginx: worker process | 0.0.0.0:80, [::]:80

Creating a second machine to increase service availability
Finished launching new machines
-------
NOTE: The machines for [app] have services with 'auto_stop_machines = "stop"' that will be stopped when idling

-------
Checking DNS configuration for hello-static.fly.dev

Visit your newly deployed app at https://hello-static.fly.dev/

```

This has configured the app with some default parameters, and generated a `fly.toml` configuration file for us.
This has configured the app with some default parameters, generated a `fly.toml`, attached a shared IPv4, created a dedicated IPv6, and deployed our image file for us.

Before deploying, we need to do one more thing. goStatic listens on port 8043 by default, but the default `fly.toml` assumes port 8080. Edit `internal_port` in the [`services`](/docs/reference/configuration/#the-services-sections) section to reflect this:
Before the app will work though, we need to do one more thing. nginx listens on port 80 by default, but the default `fly.toml` assumes port 8080. Edit `internal_port` in the [`services`](/docs/reference/configuration/#the-http_service-section) section to reflect this:

```toml
[[services]]
http_checks = []
internal_port = 8043
processes = ["app"]
protocol = "tcp"
script_checks = []
[http_service]
internal_port = 80
force_https = true
auto_stop_machines = 'stop'
auto_start_machines = true
min_machines_running = 0
processes = ['app']
```

Now we're ready to deploy:
Expand All @@ -135,10 +201,59 @@ flyctl deploy
The output should end something like this, if everything has gone well:

```
==> Monitoring deployment
==> Verifying app config
Validating /Users/jphenow/workspace/hello-static/fly.toml
✓ Configuration is valid
--> Verified app config
==> Building image
Remote builder fly-builder-little-haze-7293 ready
Remote builder fly-builder-little-haze-7293 ready
==> Building image with Docker
--> docker host: 24.0.7 linux x86_64
[+] Building 0.4s (7/7) FINISHED
=> [internal] load build definition from Dockerfile 0.2s
=> => transferring dockerfile: 90B 0.2s
=> [internal] load .dockerignore 0.2s
=> => transferring context: 100B 0.1s
=> [internal] load metadata for docker.io/library/nginx:alpine 0.1s
=> [internal] load build context 0.1s
=> => transferring context: 151B 0.1s
=> [1/2] FROM docker.io/library/nginx:alpine@sha256:a5127daff3d6f4606be3100a252419bfa84fd6ee5cd74d0feaca1a5068f97dcf 0.0s
=> CACHED [2/2] COPY public /usr/share/nginx/html 0.0s
=> exporting to image 0.0s
=> => exporting layers 0.0s
=> => writing image sha256:1e96a09c0ae89bb9b8dc5dcdcfde700fb1ee2677c20dc9d5f324a5b768328dda 0.0s
=> => naming to registry.fly.io/hello-static:deployment-01J807A99M034C3P47SBXFZZVZ 0.0s
--> Building image done
==> Pushing image to fly
The push refers to repository [registry.fly.io/hello-static]
052eb83bbfc7: Layer already exists
b0f60355fd52: Layer already exists
027907faf592: Layer already exists
11134cc97d7f: Layer already exists
f7a5847cdca9: Layer already exists
aec1e8cf14f5: Layer already exists
717b3a077b07: Layer already exists
2ff96b2e5450: Layer already exists
63ca1fbb43ae: Layer already exists
deployment-01J807A99M034C3P47SBXFZZVZ: digest: sha256:2ba357ed3fcf6eeb3a5e4c7a6e2300040cf6f414db69ce2e3b7d6030507deb5e size: 2196
--> Pushing image done
image: registry.fly.io/hello-static:deployment-01J807A99M034C3P47SBXFZZVZ
image size: 43 MB

Watch your deployment at https://fly.io/apps/hello-static/monitoring

-------
Updating existing machines in 'hello-static' with rolling strategy

-------
✔ [1/2] Cleared lease for 3287eedf034558
✔ [2/2] Cleared lease for 4d89447f4117d8
-------
Checking DNS configuration for hello-static.fly.dev

Visit your newly deployed app at https://hello-static.fly.dev/

1 desired, 1 placed, 1 healthy, 0 unhealthy [health checks: 1 total, 1 passing]
--> v0 deployed successfully
```

## _Viewing your static site_
Expand All @@ -149,9 +264,7 @@ The quickest way to browse your newly deployed application is with the `flyctl a
flyctl apps open
```
```output
opening https://gostatic-example.fly.dev ...
opening https://hello-static.fly.dev ...
```

Your browser will be sent to the displayed URL.


Loading