Practice & Assessment
Test your understanding of Deploying and Optimizing Your Portfolio
Multiple Choice Questions
6What happens automatically when you push a commit to the main branch of a GitHub repo connected to Vercel?
Which DNS record type maps a domain (www.yourname.dev) to a hosting provider like Vercel?
Which three changes will most improve a static portfolio's Lighthouse performance score?
What is the purpose of the og:image meta tag in a portfolio's head section?
Why do privacy-first analytics tools like Vercel Analytics and Plausible not require a GDPR cookie consent banner?
What does the defer attribute on a script tag do?
Coding Challenges
1Deploy Portfolio and Fix Lighthouse Score to 90+
Deploy your portfolio to Vercel or Netlify via the dashboard (no CLI required). After deployment, run a Lighthouse audit on the live URL using Chrome DevTools on Mobile preset. Identify all items flagged under Performance and fix at minimum: (1) convert all PNG/JPG images to WebP, (2) add loading='lazy' to all below-fold images, (3) add defer to your main.js script tag, and (4) add a preload link tag for any custom web font. Re-run Lighthouse and confirm a Performance score of 90 or above. Input: live deployed portfolio URL. Output: Lighthouse report showing Performance >= 90. Estimated time: 25–30 minutes.
Mini Project
Production-Ready Deployed Portfolio
Take your complete portfolio from Module 3 and make it production-ready: (1) Deploy to Vercel or Netlify with automatic Git deploys configured, (2) Connect a custom domain with correct CNAME and A record DNS configuration and verify HTTPS is active, (3) Add all required meta tags including title, description, canonical, Open Graph, and Twitter Card — with a 1200x630px og:image created for the share preview, (4) Achieve a Lighthouse Performance score of 90+ on mobile by converting images to WebP, adding lazy loading, and deferring scripts, and (5) Enable Vercel Analytics or add Plausible, and set up UptimeRobot monitoring for your live URL. Commit all changes and verify the full production URL works end-to-end.
