Create a static website on Fly
Getting an something running on Fly is basically working out how to package it as a deployable executable image. Once that is done it can be deployed to the Fly infrastructure and run on the global application platform.
For this Getting Started article, we'll look at creating a static web site from scratch, including the web server, and deploying it on Fly.
Our example will be a be hosting a HTML file. There's no need for any tools. Feel free to add in any HTML files you'd like to serve too.
You can get the code for the example from the hellostatic Github repository. Just
git clone https://github.com/fly-apps/hellostatic-builtin to get a local copy. Here's all the code for our
<html> <head> <title> Hello from Fly </title> </head> <body> <h1>Hello from Fly with a static web site</h1> </body> </html>
And that's all we need.
We are ready to start working with Fly and that means we need
flyctl, our CLI app for managing apps on Fly. If you've already installed it, carry on. If not, hop over to our installation guide. Once that's installed you'll want to login to Fly.
Each Fly application needs a
fly.toml file to tell the system how we'd like to deploy it and thats no different for a static web site. The
fly.toml can be automatically generated with the command
flyctl init command.
? App Name (leave blank to use an auto-generated name) hellostatic ? Select organization: Demo (demo) ? Select builder: static Web server builtin ? Select Internal Port: 8080 New app created Name = hellostatic Owner = demo Version = 0 Status = Hostname = <empty> Wrote config file fly.toml
You'll be asked for an application name first. We recommend that you go with the autogenerated names for apps to avoid namespace collisions. We're using
hellostatic here so you can easily spot it in configuration files.
Next you'll be prompted for an organization. Organizations are a way of sharing applications between Fly users. When you are asked to select an organization, there should be one with your account name; this is your personal organization. Select that.
Flyctl also asks you to select a builder. Builders are responsible for constructing the Docker image of your application which is then deployed to Fly's Firecracker VMs. The simplest to use are the builtin builders, which we recommend you use here. Select Static (Web server Builtin). This is minmal web server image which just serves up content in the image. If you want to know more about the various builders, see Builders and Fly.
The last thing you will be asked for an internal port value. This is the port your application communicates over. If set incorrectly, Fly will be unable to connect to the application and it will fail health checks and be terminated. The default shown, 8080, is correct for the builtin builders which, by design, get applications to talk on port 8080. So, hit return and carry on.
fly.toml file now contains a default configuration for deploying your static web site. In the process of creating that file,
flyctl has also created a Fly-side application slot of the same name, "hellostatic". If we look at the
fly.toml file we can see the name in there:~~
app = "hellostatic" [build] builtin = "static" [[services]] internal_port = 8080 protocol = "tcp" [services.concurrency] hard_limit = 25 soft_limit = 20 [[services.ports]] handlers = ["http"] port = "80" [[services.ports]] handlers = ["tls", "http"] port = "443" [[services.tcp_checks]] interval = 10000 timeout = 2000
flyctl command will always refer to this file in the current directory if it exists, specifically for the
app name/value at the start. That name will be used to identify the application to the Fly platform. The rest of the file contains settings to be applied to the application when it deploys.
We'll have more details about these properties as we progress, but for now, it's enough to say that they mostly configure which ports the application will be visible on.
We are now ready to deploy our app to the Fly platform. At the command line, just run:
This will lookup our
fly.toml file, and get the app name
hellostatic from there. Then
flyctl will start the process of deploying our web site to the Fly platform. Flyctl will return you to the command line when it's done.
Now the application has been deployed, let's find out more about its deployment. The command
flyctl info will give you all the essential details.
App Name = hellostatic Owner = dj Version = 0 Status = running Hostname = hellostatic.fly.dev Allocations ID VERSION REGION DESIRED STATUS HEALTH CHECKS RESTARTS CREATED 99731b01 0 fra run running 1 total, 1 passing 0 2m6s ago
The quickest way to browse your newly deployed application is with the
flyctl open command.
Your browser will be sent to the displayed URL. Fly will auto-upgrade this URL to an HTTPS secured URL.
- If you want to know what IP addresses the app is using, try
flyctl ips list:
flyctl ips list
TYPE ADDRESS CREATED AT v4 220.127.116.11 2m31s ago v6 2a09:8280:1:4d5b:fc11:3d05:b958:58f9 2m31s ago
You have successfully built, deployed, and connected to your first static web server on Fly.