The AI Web Stack: From Zero to Hosted
LSEG St. Louis Unconference 2025
Presented by Matthew Schrenk
October 3rd, 2025
What We'll Cover Today
AI tools are changing how we develop and are enabling technical people to branch out into new domains.
🏡 Glory Creek Ranch
A real-world example using Google AI Studio & Gemini CLI, hosted on Raspberry Pi at home
🎯 Live AI Coding Demo
Watch as we build a website together using Claude with audience suggestions
💡 Practical Tips & Tricks
Learn prompting strategies, version control, and deployment options like GitHub Pages
Case Study: Glory Creek Ranch
Built with AI from Scratch
- Created using text prompts for general pages
- Constants modified by hand in separate file
- Photos uploaded to server and stored in GIT
- Gemini CLI for Raspberry Pi setup information
- nginx configuration and deployment
- Home network with public access via router firewall
Technology Stack
Key Concepts for Success
Lessons learned from building websites with AI tools
Interface Matters
CLI coding tools with access to system commands and file operations are significantly more powerful than chat interfaces. They can read, write, and execute—enabling complete workflows.
Model Matters
Specialized coding models are essential for development tasks. They understand project structure, follow conventions, and behave differently from general-purpose base models.
Try Different Tools
Different AI tools excel at different tasks. Try out Claude, GitHub Copilot, and Gemini in an IDE and at the CLI. Ask more generic questions to a simpler model or one you don't have strict token limits on. I reached my five hour session limit making this presentation.
Context is King
Keep your conversations focused and maintain relevant context. The AI works best when it understands your project structure, goals, and constraints. Clear prompts yield better results.
Live Demo: Building with Claude
Interactive Website Creation
During this session, we'll take suggestions from the audience and build a website using Claude AI. One possible demonstration project will be creating a website for the LSEG St. Louis Unconference.
Real-time Development
Watch as we create HTML, CSS, and interactive features using AI assistance
Audience Participation
Your suggestions will shape the website we build together
GitHub Pages Deployment
See the complete process from code to live website
Your Turn: Try This Prompt
Create a Website for LSEG St. Louis Unconference 2025
📅 Event Context
The LSEG St. Louis Technology Unconference takes place Friday, October 3rd, 2025. The event features 10 technical sessions across three rooms (Training Room, Board Room, and Cozy Corner).
⏰ Full Day Schedule
| Start | End | Training Room (75) | Board Room (30) | Cozy Corner (20+) |
|---|---|---|---|---|
| 7:30 AM | 9:30 AM | Coffee Truck | ||
| 8:00 AM | 9:00 AM | Breakfast | ||
| 9:00 AM | 9:15 AM | Intro in Training Room (Stephen Carson) | ||
| 9:15 AM | 10:00 AM | Ice Breaker | ||
| 10:00 AM | 10:30 AM | Session Run-Over | ||
| 10:30 AM | 11:00 AM | Ethical Considerations of Gen AI (Richard) | Vibe Coding (Lucas) | Code Sanitizers (Michael) |
| 11:00 AM | 11:30 AM | Session Run-Over and Q&A Time | ||
| 11:30 AM | 12:00 PM | Privatizing Your Life (Travis) | Evolution of an App (Tathagata) | Developer Success (Alex) |
| 12:00 PM | 12:30 PM | Session Run-Over and Q&A Time | ||
| 12:30 PM | 1:30 PM | Lunch | ||
| 1:30 PM | 2:00 PM | The AI Webstack: From Zero to Hosted (Matthew) | Photo Editing using Lightroom and Photoshop (James) | Secure Coding Standards for C++ (Guanyu) |
| 2:00 PM | 2:30 PM | Session Run-Over and Q&A Time | ||
| 2:30 PM | 3:00 PM | Agentic AI: An Architectural Framework (Mark) | ||
| 3:00 PM | 3:30 PM | Session Run-Over and Q&A Time and VOTING | ||
| 3:30 PM | 4:00 PM | Wrap-up, Award Presenter Prizes in Training Room | ||
🎤 10 Technical Sessions
Code Sanitizers
Michael Morey
Compiler-enabled tools to detect undefined or suspicious program behavior in memory-unsafe languages at runtime.
Ethical Considerations of GenAI
Richard McWhirter
Critical thinking about technology eroding critical thinking.
Vibe Coding
Lucas Hinkebein
Getting the most out of coding with AI.
Privatizing Your Life
Travis Menghini
Setting up a personal media server at home for safe and secure storage.
Evolution of an App
Tathagata Dasgupta
Migrating from single node to distributed solution using strategic LSEG tools.
Developer Success
Alex Temple
Supporting developers in their journey at LSEG with enhanced technical support.
Photo Editing Using Lightroom and Photoshop
James Chaney
Latest AI photo editing capabilities for wildlife, landscape and portrait photography.
The AI Web Stack: From Zero to Hosted
Matthew Schrenk
Using AI to create and host websites from scratch.
Secure Coding Standards for C++
Guanyu Tian
Buffer overflow, string vulnerabilities, integer conversion issues and mitigation strategies.
Agentic AI: An Architectural Framework
Mark Sandford
Hourglass Model and Model Context Protocol (MCP) for AI agents and tools.
🎨 Design Requirements
Create a modern, professional website with a clean layout, responsive design, full day schedule table, session descriptions, and easy navigation.
This Presentation: GitHub Pages
Simple Deployment Flow
Why GitHub Pages?
Free Hosting
Static websites hosted directly from your repository
Auto Deploy
Push to repo and changes go live automatically
HTTPS
Free SSL certificates for secure connections
Custom Domains
Use your own domain or github.io subdomain
No Servers
No need to configure servers or databases
Version Control
Full Git history of all your changes
Perfect for: Documentation sites, portfolios, project pages, presentations, and any static HTML/CSS/JavaScript content
Questions & Demo Ideas
Questions?
Live Demo Suggestions
What features should we add to the unconference website?
Matthew Schrenk
Thank you for attending!