JAM.26
ARCHIVE / DAY 3 — Deployment, Discovery & Optimization
YOUR EXERCISE_
SEASON 2026 // DAY 03 OF 03
ai-programming-jam.shoug-tech.com / workshops / day-3
README.md

# Deployment, Discovery,
and Optimization

Working on localhost is not the finish line. Today your application goes public: deployed, reachable through a real domain, discoverable by search engines, and tested the way real users will actually experience it.

You'll deploy with Vercel, connect a custom domain through Cloudflare, prepare the site for search engine discovery, and use Google PageSpeed Insights to identify meaningful improvements instead of chasing a score.

Today you'll practice
Deploy → Connect Domain → Verify → Discover → Optimize
You'll use
Vercel, Cloudflare, Search Console, Bing Webmaster, PageSpeed
By the end
A live production URL you can share
00

## Before You Start

You should be able to do all of this already — flag an instructor if not:

This day builds directly on Day 1 and Day 2 — bring the project you've been working on.
Accounts You'll Need
GitHubVercelCloudflareGoogle Bing Webmaster ToolsFirebaseClaudeOpenAI / Codex
Software You'll Need
Visual Studio CodeGitNode.js npmA modern web browserClaude CodeCodex
01

## Local Development vs. Production

An app working on localhost doesn't mean it's ready for real users. Production brings its own considerations: hosting, domains, DNS, environment variables, external services, security, performance, accessibility, and search engine discovery.

Local Code → GitHub → Build → Hosting → DNS → Browser → External Services
02

## Deploying with Vercel

Vercel connects directly to your GitHub repository and builds/deploys your app automatically. That gives you a simple, repeatable workflow:

Code → Commit → Push → GitHub → Vercel → Production
Production configuration: set required environment variables in the hosting platform. Never commit private server-side secrets, tokens, or credentials to GitHub.
03

## Domains and DNS

Hosting and domains solve two different problems. Vercel hosts your app. Your domain is the human-readable address. DNS tells the internet where that domain should actually point — and Cloudflare is where you manage that.

  • Domain
  • DNS & DNS records
  • A records
  • CNAME records
  • Root domain vs. subdomain
  • DNS propagation
  • HTTPS
  • Vercel domain verification
User enters domain → DNS resolves domain → Request reaches Vercel → Vercel serves your app
DNS changes are not always visible everywhere immediately. If the configuration is correct but the domain is inconsistent, propagation may still be in progress.
04

## Production Verification

Once deployed, test your app again — in production, not just locally.

Production is a separate test target. A green deployment status confirms the build deployed. It does not prove your application behavior is correct.
05

## Search Engine Discovery

Publishing a site doesn't automatically make it appear in search results. Search engines have to discover, crawl, understand, and index your pages first.

Website → Discovery → Crawl → Index → Search Result
06

## Google Search Console & Bing Webmaster Tools

These tools let you tell search engines about your site directly, and let you inspect how they see it.

Submitting a URL does not guarantee immediate indexing or ranking. Webmaster tools help search engines discover and inspect your site, but search visibility can take time.
07

## PageSpeed Insights

A website shouldn't just function — it should be usable. PageSpeed Insights surfaces opportunities across performance, accessibility, best practices, and SEO.

Measure → Read Findings → Prioritize → Change One Thing → Deploy → Measure Again
Treat the report as diagnostic information, not a score to chase for its own sake. Prioritize user impact, accessibility, and meaningful performance improvements.
08

## Production Debugging

Production problems follow the same evidence-based process you already know — with one extra step.

Expected → Observed → Evidence → Hypothesis → Fix → Deploy → Verify
Code → Build → Vercel → DNS → Browser → Firebase / External Service
09

## Prompt Templates You Can Use

Copy these into Codex or Claude Code and fill in the bracketed fields.

01 — production readiness review
Review this project for production readiness before I deploy it. Do not make any changes yet. Inspect the application and identify: 1. Required environment variables 2. Build or deployment concerns 3. Firebase configuration concerns 4. Client-side errors that could appear in production 5. Routing concerns 6. Security concerns 7. Missing production configuration Prioritize issues that could prevent the application from functioning after deployment.
Use this: before your very first deploy — catch problems before they happen live.
02 — diagnose a failed deployment
My Vercel deployment failed. Here is the relevant deployment output: [PASTE ERROR] The application works locally using: [LOCAL COMMAND] Before changing anything, identify the most likely root cause from the deployment evidence. Explain your reasoning and recommend the smallest appropriate fix. Do not modify unrelated functionality.
Use this: the moment a Vercel build fails. Paste the actual log — not a summary.
03 — pagespeed analysis
I ran my production website through Google PageSpeed Insights. These are the most important findings: [PASTE FINDINGS] Review the existing project and determine which findings are actionable in the codebase. Prioritize the improvements based on: 1. User impact 2. Performance impact 3. Accessibility impact 4. Implementation effort 5. Risk of breaking existing functionality Do not make changes yet. Give me a prioritized optimization plan first.
Use this: right after running PageSpeed Insights, before touching any code.
04 — SEO and indexing review
Review this website's codebase for basic technical SEO and search engine discoverability. Check for: - Page titles - Meta descriptions - Semantic HTML - Heading structure - robots.txt - Sitemap - Important public routes - Broken internal links - Other obvious indexing problems Explain each issue and its impact before making changes.
Use this: before submitting your site to Google Search Console or Bing Webmaster Tools.
05 — diagnose domain or DNS problems
My Vercel deployment works at: [VERCEL URL] But my custom domain has this problem: [ACTUAL BEHAVIOR] Vercel domain status: [STATUS] Cloudflare DNS records: [RELEVANT RECORDS] Before recommending changes, determine whether the likely failure is: 1. DNS configuration 2. Domain verification 3. DNS propagation 4. HTTPS / certificate state 5. Application behavior Explain the evidence for your diagnosis and recommend the smallest appropriate next step.
Use this: when the deployment works but the custom domain does not.
10

## Worked Example

The instructor will continue the Study Task Tracker from Day 2 and take it through the full production journey: from GitHub to a public custom-domain application that has been verified, prepared for discovery, measured, and improved.

  1. Open the completed Day 2 application and confirm it's pushed to GitHub.
  2. Connect the repository to Vercel.
  3. Review the project's deployment configuration.
  4. Configure required environment variables.
  5. Deploy the application.
  6. Open the Vercel production URL and test key functionality, including Firebase auth and data.
  7. Review the production browser console.
  8. Add a custom domain to the Vercel project.
  9. Open Cloudflare DNS management and configure the required records.
  10. Verify the domain connects, then open the app using the custom domain.
  11. Verify HTTPS and re-test app functionality.
  12. Review robots.txt and the sitemap.
  13. Walk through Google Search Console and Bing Webmaster Tools.
  14. Demonstrate sitemap submission or URL inspection.
  15. Run the production URL through PageSpeed Insights and review the report.
  16. Pick one meaningful improvement, implement, test locally, commit, and push.
  17. Let Vercel redeploy, verify the change in production, and rerun PageSpeed Insights to compare.
IMAGES
Worked Example Screenshots
Drop in screenshots of the Vercel deployment, the Cloudflare DNS setup, and a before/after PageSpeed report.
VIDEO
Instructor Demo Recording
Add the Day 3 deployment, domain, discovery, and optimization walkthrough here later.
Watch the full chain: GitHub → Vercel → Cloudflare → Production Domain → Search Engines → PageSpeed Insights → Improvement → Redeployment. The app should stay functional the whole way through.
11

## Your Exercise

Continue the Campus Event Board from Days 1 and 2 and take it through the same production journey.

Campus Event Board → GitHub → Vercel → Domain → Verify → Discover → Measure → Improve

Steps

  1. Verify the application works locally, then commit and push any working changes.
  2. Connect the repository to Vercel and configure required environment variables.
  3. Deploy the application, then open the production URL.
  4. Test the app's critical functionality, Firebase authentication, and persistent data.
  5. Inspect the browser console for production errors.
  6. Configure your assigned domain or subdomain, and the required Cloudflare DNS records.
  7. Verify the domain connects successfully and that HTTPS works.
  8. Test the app again using the custom domain.
  9. Verify basic page metadata, and create/verify robots.txt and a sitemap where appropriate.
  10. Configure Google Search Console and Bing Webmaster Tools; submit or verify your sitemap.
  11. Run the production URL through PageSpeed Insights and review the results.
  12. Identify one meaningful improvement, implement and test it, then commit and push.
  13. Verify the new Vercel deployment, retest production, and document your final production URL.

You're done when...

12

## Troubleshooting

Hit one of these? Work through it before asking for help.

If this happens

App works locally, but the Vercel build fails

Why it happensBuild errors, missing dependencies, environment variables, incorrect project configuration, case-sensitive file paths, or code that behaves differently during production builds.
What to doRead the Vercel build logs and find the first meaningful error. Ask yourself: what specifically failed, according to the log? Fix that problem — don't make unrelated changes.
If this happens

The site deploys, but Firebase doesn't work

Why it happensProduction configuration, environment variables, Firebase settings, authorization configuration, or app logic that behaves differently in production.
What to doCompare local vs. production behavior directly. Inspect the browser console and network activity. Ask: what actually changed between localhost and production?
If this happens

The Vercel URL works, but your custom domain doesn't

Why it happensIncorrect DNS records, incomplete verification, conflicting records, or DNS propagation still in progress.
What to doCheck the domain status in Vercel and compare it against your Cloudflare DNS configuration. Ask: does the app fail, or does the request never even reach it?
If this happens

PageSpeed score is lower than expected

Why it happensLarge assets, inefficient loading, accessibility problems, metadata issues, layout behavior, or implementation choices.
What to doRead the individual findings — not just the overall score. Ask which finding actually affects the real user experience most, fix that one thing, redeploy, and retest.
If this happens

A route works through navigation, but refreshing it fails

Why it happensClient-side routing and production hosting configuration may not agree about how that route should be served.
What to doConfirm the framework and routing strategy, inspect the production response for the failing URL, and verify the hosting configuration required for direct route access.
If this happens

Your site isn't showing up in search results yet

Why it happensDeployment and indexing are separate processes — search engines may simply not have discovered or indexed your site yet.
What to doCheck accessibility, indexing configuration, webmaster tools, sitemap status, and URL inspection info. Verify your site is crawlable and properly submitted. Indexing and ranking are not immediate — that's expected.
13

## Self-Check Before You Leave

Can you tick all of these? If not, flag an instructor before the session ends.

14

## Resources

Before deployment: Local Test → Commit → Push → Production Configuration
Deployment: GitHub → Vercel → Build → Production URL
Domain: Domain → Cloudflare DNS → Vercel → HTTPS
Verification: Load → Navigate → Authenticate → Read/Write Data → Console → Network
Discovery: Metadata → robots.txt → Sitemap → Google → Bing
Optimization: PageSpeed → Prioritize → Improve → Commit → Deploy → Retest
FILES
Participant Handouts Placeholder
Add downloadable JAM.26 deployment, DNS, production verification, discovery, and PageSpeed handouts here later.