Using the Web App Builder
The web app builder provides an opportunity for you to create your new serverless web app with some options for customization. You get to choose a template for your app, some colors, connect your Cloudflare services, OAuth providers, etc.
App Details and Theme
You'll first come to the app details portion of the form, where you select some foundational components for the generation of your codebase.
Select Frontend Framework and App
These dropdowns determine what app will be generated for you by The Worker Bee. At the moment, we can generate these apps:
- Vanilla JS Todos
App Name
Here's where you provide an app name that will populate throughout your generated project. Your chosen app name will precede the name for each of your generated Cloudflare Workers APIs (e.g., your-app-auth).
Domain
Custom domains are supported by The Worker Bee. If you don't yet have a domain, then I'd recommend using Cloudflare's domain registry to search for and purchase a domain name that you'd like:
The domain that you provide in this field of the web app builder will populate throughout your codebase and tie itself to your Worker APIs. Both your primary site (https://yourdomain.com) and your APIs (https://yourdomain.com/api/) will leverage your domain throughout your project.
Colors
Here you can choose a custom color scheme and preview the color changes in the preview window. Remember to choose colors that provide for high contrast text, so people can easily read your app's content.
Cloudflare and GitHub
This part of the form allows us to connect your codebase to the services used for repository management and app deployment.
Cloudflare API Token
Hover over the "?" tooltip and click the link inside. This link will bring you to an API token creation screen that is prefilled with all of the necessary scopes for The Worker Bee. Scroll down and click "Continue to Summary", then click "Create Token".
If your Cloudflare user is a member of multiple accounts, you'll have to specify the account resource for this token.
Project Repository Creation
If you already have a GitHub account, then all you need to do is click the "Install our GitHub App" button and install The Worker Bee's GitHub app. This will provide us with all of the necessary permissions for setting up your repository and repository's secrets and variables.
Advanced Settings
The final portion of the form is the advanced settings portion. This is where you can provide your Google Client ID and Secret that you copied in the OAuth setup guide.
For the emailing section, you can provide the API key that you copied from ZeptoMail earlier. In the "Email From Address" field, you can provide an email address of your choosing that uses the same domain that you're using for the project and have email configured for in ZeptoMail. You can choose to provide any sender's name for the "Email From Name" field; this is the name that recipients of your emails will see when they receive an email from you (e.g., Support, Marketing, etc.).