Let’s build & deploy a new app! A fun new “gameshow” / trivia tower web app, with “Who Wants To Be A Millionaire meets Wordle” vibes, implemented with fullstack SvelteKit!
We’ll start by setting up a different deployment option: Fly!
I’ve been showing Vercel deployments in most of my livestreams, but I do use other solutions from time 🙂 And the community really wanted me to show another option!
Cloudflare Workers is another popular option in the Serverless space, but today we’ll show a different approach altogether: An actual, always-on, cloud server with Fly.io 🚀 Is this old-school? Post-modern? We'll discuss 😄
💻 See the code (private repo 😱): https://github.com/johnnify & https://github.com/johnnify/trivia-train
If you’re a beginner, you may want to start with our Portfolio "Paulina Puppers" series, and end up with the same or an equivalent project: • Brand new Fullstack App with Svelte 5...
Check around the channel for more playlists and increasingly complicated tech stack choices 🙌
— JOHNNIFY PREMIUM —
Get this repository AND MORE with Johnnify Premium: https://johnnify.com/premium
— 🙌🙌🙌 —
— COMMUNITY —
Our DISCORD SERVER 👾: / discord
— 🥳🥳🥳 —
— Agenda —
✅ What are we doing today? A gameshow? Who wants to be a millionaire, but it’s free text answers, with Wordle elements?!
✅ How come we’re not doing Vercel today? Is “serverless” too costly? What happened with Cara? https://turso.tech/blog/dont-give-up-... & https://cara.app/explore
✅ Deploying to Fly.io! https://fly.io/docs/js/frameworks/sve...
✅ How to handle environment variables?! https://fly.io/docs/reference/build-s...
✅ Github action for automatic deployments! https://fly.io/docs/app-guides/contin...
✅ How can Turso SQLite work with Fly? https://turso.tech/edge
✅ Deploy Previews! https://fly.io/docs/blueprints/review...
✅ Turso embedded replicas: https://docs.turso.tech/features/embe...
✅ Deploying to a custom domain: https://fly.io/docs/networking/custom...
— NEXT STEPS —
[ ] Fetching the latest Quiz!
[ ] Submitting & Validating answers… with ChatGPT!
[ ] Going through the whole Quiz!
[ ] High scores!
[ ] Answer timer!
[ ] Countdown to the next quiz
[ ] UI / CRM to add quizzes
[ ] Extra lives & skips!
[ ] Share your results to your friends and socials!
— HAVE FUN —
No affiliations whatsoever: if I show something, you know you're hearing my unfiltered thoughts 😄
— Highlighted software —
SvelteKit: https://kit.svelte.dev/
Fly.io: https://fly.io/
Tailwind: https://tailwindcss.com/
Turso: https://docs.turso.tech/introduction
Drizzle ORM: https://orm.drizzle.team/
My own website: https://magrippis.com/
Search for `@jmagrippis` to find me on socials like Instagram & Twitter! And remember our DISCORD SERVER 😉: / discord
Between the comment section and the socials, let me know *somewhere* what you’d like me to cover next 🙌
Stream number 108!
—
TIMESTAMPS
—
00:00 - What are we doing today?
7:29 - How come we’re not doing Vercel? Is “serverless” too costly? What happened with Cara?
23:15 - Deploying to Fly.io!
36:45 - How to handle environment variables?!
43:00 - Local build with environment variables & deploy to Fly!
1:22:40 - Deploy with local .env for environment variables
1:28:50 - Local deployment with env vars recap!
1:33:40 - Github action for automatic deployments!
1:42:55 - BREAK
1:46:50 - Passing environment variables to the Github action!
2:27:18 - CI/CD 🥳 DEMO!
2:30:56 - How can Turso SQLite work with Fly?
2:49:40 - Deploy Previews!
3:19:20 - Turso embedded replicas
3:23:15 - Deploying to a custom domain
Watch video How to deploy SvelteKit to Fly.io 🚀 New “Game Show” app! Svelte 5 tutorial 👨🏫 LIVE Coding & Chill 🔴 online without registration, duration hours minute second in high quality. This video was added by user Johnny Magrippis 01 January 1970, don't forget to share it with your friends and acquaintances, it has been viewed on our site 393 once and liked it 16 people.