If you love the repo, Please 🌟 it! ❤️
Using Cloudflare Workers, I deployed an application that will randomly send users to one of two webpages. This project taught me how to write applications with the Cloudflare Workers API, manage and develop them using the command-line tool Wrangler, and deploy them to the free workers.dev deployment playground.
The Workers Quick Start in the documentation shows how to get started with Wrangler, creating a project, and configuring and deploying it. We highly recommend that you spend time reading and following along with this guide!
To begin, install the Wrangler command-line tool.
Using the generate command (covered in the Quick Start), generate a new project with a name of your choice:
$ wrangler generate your-project-name https://github.com/cloudflare-internship-2020/internship-application-fullstack
The recently launched wrangler dev feature will allow me to begin developing my application using localhost - this means that I can test my project locally and make sure it works, without having to sort out deployment until later in the exercise.
Note that a major benefit of using wrangler dev is the ability to output console.log statements to your terminal - this is super useful for inspecting HTTP responses and variables!
Every Workers user has access to a free, unique workers.dev subdomain, which allows you to deploy your projects to a stable URL without needing to purchase domains and configure DNS records. Following the Quick Start linked above includes setting up a workers.dev subdomain!
Using wrangler's publish command, you can deploy your application and make it available under your workers.dev subdomain. Make sure to include this when you submit your project!
When submitting your project, you should prepare your code for upload to Greenhouse. The preferred method for doing this is to create a "ZIP archive" of your project folder: for more instructions on how to do this on Windows and Mac, see this guide.
In addition to submitting your project code, you should also submit the URL of your deployed project (see "Deployment"). This will be in the format your-project-name.your-subdomain.workers.dev.
For each variant page, there are a number of items on the page that can be customized. Try changing the following values inside of the variant, adding your own text or URLs:
-
title: the title of the web page, displayed on the window or tab title in your browser. -
h1#title: the main title of the page. By default, this displays "Variant 1" or "Variant 2" -
p#description: the description paragraph on the page. By default, this displays the text "This is variant X of the take home project!". -
a#url: a Call to Action link with strong emphasis on the page. Try changing this to a URL of your choice, such as your personal website, and make sure to update the text "Return to cloudflare.com" as well!
This can be done using the HTMLRewriter API built into the Workers runtime, or using simple text replacement.
If a user visits the site and receives one of the two URLs, persist which URL is chosen in a cookie so that they always see the same variant when they return to the application. A cookie would be a great way to implement this!
If you have a registered domain/zone with Cloudflare, try deploying your project by customizing the zone_id and route in your wrangler.toml. Make sure to check out the Quick Start in the Workers docs for details on how to do this! Note: domains cost money, so if you don't have one, please don't feel obligated to buy one for this exercise. This is an extra credit task and you won't be penalized for skipping this one, we promise!