Back to Projects

GenZcareers — Job Marketing Platform

Job marketing website for international students seeking US jobs. Vanilla HTML/CSS/JS single-page site with Google Apps Script form-to-Sheets backend (serverless CRM).

HTML5CSS3JavaScriptGoogle Apps ScriptGoogle SheetsNginxDockerGCP Cloud RunCloud Load BalancerHostinger DNS

Role

Full-stack Developer

Team

Solo

Company/Organization

Freelance

The Problem

GenZcareers needed a professional web presence to attract Indian and international students seeking US employmentrequired fast iteration with...

Contact form needed to capture leads (name, email, phone, message) without running a backend server or databasestartup had zero infrastructure...

Site needed custom domain with HTTPS, CDN-like caching, and professional deployment infrastructurenot just a basic GitHub Pages deployment.

Content updates needed to be possible by non-technical team members without code changes or complex deployments.

The Solution

Built a lean, production-grade marketing website optimized for speed and simplicity.

Frontend (Vanilla HTML/CSS/JS)

index.html — Single-page layout with semantic HTML5: navigation, hero section with CTA, services grid, testimonials carousel, pricing tiers,...

styles.css — Custom CSS with CSS variables for theming, responsive breakpoints (mobile-first), smooth scroll behavior, and animated transitions.

script.js — Client-side logic: mobile nav toggle, smooth scrolling, form validation, and Google Apps Script form submission handler with loading...

Backend (Google Apps Script → Google Sheets)

Google Apps Script deployed as Web App receives POST requests from contact form, parses data, appends row to Sheet (timestamp, name, email, phone,...

Google Sheets as CRMeach submission creates a new row with timestamp. Team can filter, sort, and manage leads directly in Sheets.

Deployment (GCP Cloud Run + Load Balancer)

Nginx-based Docker container serving static files with custom caching headers (HTML: no-cache, assets: 1hr, gzip enabled).

GCP Cloud Run with automatic scaling. Cloud Load Balancer with static IP (35.207.239.70) for DNS.

Hostinger DNSA records for root (@) and www pointing to Load Balancer IP. HTTPS via GCP managed SSL certificates.

Design Decisions

Vanilla HTML/CSS/JS over React/Next.jsno build step, instant page loads, zero framework overhead. Static marketing site doesn't need component...

Google Apps Script + Sheets over a backend APIzero infrastructure cost, no server maintenance, built-in spreadsheet interface for lead management....

GCP Cloud Run over GitHub Pages/Netlifyprovides Docker containerization, custom Nginx configuration for caching control, Load Balancer with static...

Nginx reverse proxy over direct servingenables custom cache headers per file type, gzip compression, and SSL termination. Professional-grade...

Single-page design over multi-pagemarketing site with 5 sections doesn't warrant separate pages. Single HTML file with smooth scroll anchors...

Tradeoffs & Constraints

No framework means manual DOM manipulationform handling, navigation toggle, and scroll effects are vanilla JS. Acceptable for a small site but...

Google Apps Script has execution quotasfree tier allows ~20,000 submissions per day. Sufficient for marketing but would need a real backend at...

No CMScontent updates require editing HTML directly. Faster than CMS overhead for a small team comfortable with code.

Would improve: Add structured data (JSON-LD) for SEO, implement Open Graph meta tags for social sharing, add Google Analytics, implement A/B testing...

Outcome & Impact

Production marketing website on GCP Cloud Run: Docker + Nginx + Cloud Load Balancer with static IP + Hostinger DNS + managed SSL.

Google Sheets CRM via Apps Scriptzero backend maintenance, zero infrastructure cost, accessible by entire team.

Sub-second page loads with zero framework overheadvanilla HTML/CSS/JS served via Nginx with gzip compression.

Responsive single-page design with hero, services, testimonials, pricing, and contact formmobile-first CSS with smooth scroll navigation.

Tech Stack

Frontend: HTML5 (semantic), CSS3 (Grid, Flexbox, CSS variables), vanilla JavaScript

Backend: Google Apps Script (serverless form handler), Google Sheets (lead storage/CRM)

Server: Nginx (reverse proxy, caching, gzip compression)

Infrastructure: Docker, GCP Cloud Run, Cloud Load Balancer (static IP), Hostinger DNS

Back to Projects