This article is about deploying a PyScript application on Deno Deploy. If you are familiar with Deno and Deno Deploy then you already know that Deno is a JavaScript framework and deploy service. Why deploy PyScript on a JavaScript platform? There are some good reasons for the Python/PyScript developer:

  1. The starting level is free.
  2. Free autorenewing SSL certificates.
  3. GitHub integration.
  4. Unlimited deployments.
  5. 32 network locations.
  6. Applications are served very fast.

If you are developing a PyScript application and want to deploy it to a server to test with a domain name and SSL certificate, Deno Deploy is an amazing service.

Note: Your own domain name is not required as Deno Deploy will create a subdomain for your application on deno.dev with an SSL certificate.

The PyScript Application

Neil Stoker wrote a cool Chess Match Viewer application in Python. You can view this application on Neil’s website. You can view my copy of the application deployed to Deno Deploy here. The repository for this article is here.

Since Neil published his work on GitHub all the hard work is complete and we can focus on deployment.

For this article, we will take Neil’s application and deploy it to Deno Deploy:

  • Clone Neil’s GitHub repository.
  • Modify for Deno Deploy.
  • Create a new GitHub repository.
  • Create a Deno Deploy project.
  • Deploy the application to Deno Deploy.
  • Configure a Custom Domain.

Requirements:

  • Deno Deploy account. Sign up here.
  • GitHub account.
  • GitHub repository (used for CI/CD).
  • Deno installed. Instructions here.
  • Git CLI installed. Instructions here.
  • GitHub CLI installed. Instructions here.
  • Optional: your own domain name.

Step 1: Clone Neil’s Repository

Neil’s repository is located here. In this step, we will clone the repository to a local directory. Then we will verify that the application functions correctly using a local Python server.

Move into the repository:

Verify that the application functions normally using a local Python web server:

Launch a web browser and connect to the application. Verify that the application runs correctly.

Press Control-C to kill the web server.

Step 2: Modify for Deno Deploy

The primary page in the Chess application is chess.html. Rename chess.html to index.html:

Create a Deno JavaScript static web server:

server.ts

Verify that the application functions normally using a local Deno static web server:

Launch a web browser and connect to the application. Verify that the application runs correctly.

Press Control-C to kill the web server.

Step 3: Create a new GitHub repository

Since we cloned this application from an existing GitHub repository, delete the “.git” directory. There are other methods to keep your repository linked to Neil’s, but those options are not the goal of this article.

Initialize a new Git repository:

Authorize the GitHub CLI:

Create a new GitHub repository

Add the files and push them to GitHub

Step 4: Create a Deno Deploy project

Open a web browser and log into your Deno Deploy account.

  1. Click “New Project”.
  2. Select the GitHub repository (chess).
  3. Select the production branch (master).
  4. Select the JavaScript server file (server.ts).
  5. Click the “Link” button.

Step 5: Deploy the application to Deno Deploy

Clicking the “Link” button in the previous step deploys your application. Once the deployment completes, the Overview tab will display your application’s URLs. Open a web browser with one of the two URLs. Voila, you have deployed a PyScript application.

To modify your application and auto deploy updates, follow the normal GitHub edit, commit and push steps. GitHub will notify Deno Deploy that a new version has been pushed. Deno Deploy will then automatically deploy the new version.

Step 6: Configure a Custom Domain (optional)

This step requires control of your own domain name and DNS servers.

  • In the Deno Deploy project window, click “Settings”.
  • Scroll down to “Domains”.
  • Click “Add Domain”.
  • Enter a domain name such as chess.example.com.
  • Click Save.
  • Click the “Setup” button.
  • A table with three DNS resource records is displayed. Go to your DNS server and create the resource records (A, AAAA, CNAME).
  • Once you have created the DNS resource records, click the “Validate” button.
  • Click “Get automatic certificates”. You can also upload your own SSL certificate.

More Information

Photography Credit

I write free articles about technology. Recently, I learned about Pexels.com which provides free images. The image in this article is courtesy of Mike B at Pexels.