Zero To Shipped
An engaging video course
Master Fast-Paced Fullstack Development.
Finally ship that product.
$299
$149
Taught by
Kitze
This badge costs $8 on Twitter, but free when you add it yourself with CSS *taps forehead*
17
days
16
hours
16
minutes
59
seconds
last chance to get it with 50% discount!
Feeling intimidated by fullstack development? Wondering how can some developers ship a functional app in one day? This engaging video course demystifies and simplifies the process, helping you build and ship products quickly. Turn the scary world of fullstack development into an approachable and enjoyable experience.
Hi, I'm Kitze 
Founder of Sizzy: The Browser For Developers
#1 Product of the day on Product Hunt
#1 Product of the week on Product Hunt
Featured on Hacker News (multiple times)
Featured on TechCrunch
I've been suffering the pain of web development for the last 15 years.
I've been through it all: Dreamweaver. Wordpress. jQuery. PHP. Filezilla. Coffeescript. SPA. Mustache. Handlebars. Angular. Gulp. Bower. React. Webpack. Redux. MobX. GraphQL. Gatsby. Next. You name it.
I've tried everything under the sun, but I've never stuck with anything for longer than a few months. Finally, and I'm saying this with tears in my eyes, I found a stack that I'm using for more than 3 years.
I've shipped production apps that made over a million dollars in revenue. I want to teach you how you can do the same. It's not that complex.
I've been through it all: Dreamweaver. Wordpress. jQuery. PHP. Filezilla. Coffeescript. SPA. Mustache. Handlebars. Angular. Gulp. Bower. React. Webpack. Redux. MobX. GraphQL. Gatsby. Next. You name it.
I've tried everything under the sun, but I've never stuck with anything for longer than a few months. Finally, and I'm saying this with tears in my eyes, I found a stack that I'm using for more than 3 years.
I've shipped production apps that made over a million dollars in revenue. I want to teach you how you can do the same. It's not that complex.
Themagicstack
The simplicity and the power of this stack is unparalleled.
You can go from zero to shipped product in a matter of hours.
You can go from zero to shipped product in a matter of hours.
Next.js
The React Framework for the Web
Used by some of the world's largest companies, Next.js enables you to create full-stack web applications by extending the latest React features.
Blitz.js
The Missing Fullstack Toolkit for Next.js
Blitz picks up where Next.js leaves off, providing battle-tested libraries and conventions for shipping and scaling world wide applications.
Prisma
Next-generation Node & TypeScript ORM
Prisma unlocks a new level of developer experience when working with databases thanks to its intuitive data model, automated migrations, type-safety & auto-completion.
Mantine UI
A fully featured React components library
Mantine helps you build fully functional accessible web applications faster than ever. It includes 150+ customizable components and hooks.
TypeScript
A Robust, Type-Safe Superset of JavaScript
Master TypeScript's type-checking strengths to catch potential errors early and enhance confidence when handling data fetching and updates, ensuring a more reliable and efficient application.
Zod
TypeScript-first schema validation with static type inference
Learn how Zod's expressive API leads to more reliable and robust projects, catching potential errors early and streamlining your development process.
Order now
Last chance to get it with 50% discount!
$299
$149
All the videos
30% discount coupon for
SizzyEnrolling in this course is more than just learning.
It's a commitment to yourself that you'll finally ship that product.
Buy nowIt's a commitment to yourself that you'll finally ship that product.
14-day money-back guarantee.
We got you covered
Everything that you need
No hypothetical examples, no toy apps. We'll be using all the techniques to build a real app that will go live in production.
- Authentication
- Login
- Logout
- Sign up
- Reset password
- Forgot password
- Verify email
- Databases
- Install Postgres
- Work with Prisma
- Start a local database server
- Browse and manage databases
- Host a production database
- Clone data from a production database
- Use the DB clone while maintaining privacy of your users
- Roles
- Separate user roles on DB level
- Admin role
- Only certain roles can perform queries/mutations
- Easily allow/block actions in the app based on a role
- Emails
- Handle email with Mailgun
- Set up Mailgun DNS with Namecheap
- Send emails from your domain
- Receive emails
- Composing emails with react and JSX
- Let users manage their email settings
- Let users unsubscribe from emails
- Easily preview emails in browser
- While developing, catch local emails in a mailbox instead of sending them
- Catch staging emails in a shared inbox (that your team can see)
- Send email in bulk to multiple users based on certain criteria
- Payments
- Payment integration with LemonSqueezy
- A layer on top of Stripe that takes care of VAT, taxes, etc.
- Accept one-time or subscription payments
- Webhook integration to get notified on new payments and subscriptions
- User portal for managing user subscriptions
- Admin dashboard for managing users and subscriptions
- Image video & uploads
- Let users upload images and videos
- Automatically get user profile pictures from gravatar, twitter, github
- Styling
- Techniques for using Mantine UI more efficiently
- Layout components for easily working with Horizontal, Vertical, and Grid elements (auto responsive)
- Easily change the theme for all of your components
- Implement light mode and dark mode
- Different environments
- Local environment
- Expose local environment for testing webhooks etc.
- Set up a staging environment (auto deployed from “development” branch)
- Production environment (auto deployed from “main” branch)
- Easily simulate staging/production env variables while working locally on your app
- Typesafety
- Typesafe routes
- Typesafe forms
- Typesafe queries
- Typesafe modals
- Typesafe mutations
- Typesafe env variables (build fails if a variable is missing)
- Live and fresh data
- Techniques that will make your website feel as realtime as possible
- Optimistic UI
- Hosting
- Buy a domain for your app
- Host your app on a server
- Connect your deployment to a domain
- Have different subdomains for variations of the app, or other apps
- i.e staging, admin, dashboard, etc.
- Forms
- Typesafe forms
- Styled with Mantine
- Easily composable
- Error handling
- Handle errors with error boundaries
- Show errors in toast
- Show errors in form fields
- Automatically catch errors with Sentry
- Get notified on errors in Slack
- User profiles
- Change password
- Upload profile/cover picture
- Nudge user to finish profile
- Keyboard shortcuts
- Local keyboard shortcuts
- Global keyboard shortcuts
- Displaying shortcuts and keep them in sync with bindings
- Dynamic meta tags
- Easily generate dynamic meta tags with Next.js
- Use JSX and inline styles / tailwind for dynamic meta tags
- Admin panel
- Browse all users
- Manage user payment subscriptions
- Manage billing plans
- Accept/reject invites
- Send an invite to a user directly
- Responsiveness
- Techniques to make the app responsive without manually dealing with media queries
- Tips and tricks on using Sizzy for responsive design
- Pagination
- Server side logic for pagination
- Client side logic for pagination
- Quick code scaffolding
- Quickly scaffolding with Blitz codegen
- WebStorm Live Templates
- Webstorm File Templates
- Leveraging plop for quick code generation
- Landing page
- When no user is logged in, show a basic landing page
- Use Mantine to quickly make a landing page for your app
- Modal management
- Easily manage global modals
- Local modals
- Stacking modals
- Blocking modals that prevent the user to use the app until they take an action (i.e changing timezone, onboarding, etc.)
- Animations
- Use auto-animate to make your app feel more alive
- Make your UI nicer with hover interactions (i.e row of icons that appears on hover)
- Enter/Exit animations
- Blog
- Add a blog section to your website
- Manage content with MDX files
- Render MDX
- Custom MDX elements and components
- Server render your blog
- Server-side rendering
- Some pages have to be server rendered for better performance and SEO
- Learn techniques on how to do that with Next.js
- Onboarding wizard
- Welcome users with an onboarding wizard
- Mandatory and async steps
- Exposing an API
- Expose typesafe API endpoints with Next.JS so that other apps can integrate with your app
- Allow user to generate an API token and use the API endpoints of your app
- Cron jobs
- Schedule cron jobs to do something periodically
- Invite system
- Set up an invite
- Let users request an invite
- Admin can browse the invites and search / accept them
- Admin sends gift codes to users, 5 invites each
- Users send invite links to their gift codes to other users
- Command bar
- Set up a command center for your application
- Similar to macOS spotlight, Alfred and Raycast
- Let users easily navigate and do actions in your app
- Webhooks
- Let your users set up webhooks
- Ping the webhook URLs when certain events happen in your app
- Timezones
- Let user save their timezone
- Auto detect timezone changes and let user confirm
- Display and filter data in user’s timezone
- Using AI
- Use AI tools like ChatGPT efficiently
- Techniques for using GitHub Copilot and quickly scaffolding code
- Use Midjourney to generate icons, images, landing page elements, and assets for your app
- Kitze’s Workflow
- Learn Kitze's techniques for quickly shipping apps
- All the apps that that will enhance your dev. workflow
- The setup and plugins for your code editor
- Keyboard shortcuts
- Live templates
- Scripts
- OAuth
- Let users sign up and login with
- GitHub
- Mobile PWA
- Make your app behave like a native app on iOS/Android
- Techniques for styling etc.
- Custom icon
- Custom splashcreen
- Desktop app
- Easily convert your app into a desktop app with Electron
- Installer with updates
- Dock icon badge
- Menubar tray text
- Custom menu bar popup
- AI integration
- Implementing AI in your app with the OpenAI API
- Moderate content with AI
- Analytics dashboard
- Easily host and create a dashboard to look at the stats from your app
- Example: how many users signed up, bought a subscription, did an action, etc.
- Host dashboard on a subdomain
- Status page
- Show the availability of your app on a separate status page
- Integrate with a downtime monitoring service
- Slack integration
- Get notified when users sign up
- Get notified on new payments
- Get notified on errors in your app
- Telegram bot integration
- Easily control your app with Telegram
- Let users perform certain actions through telegram
- Downtime monitoring
- Monitor if your app is up
- Get pinged/called when it goes down
- Integrate and show the availability on a status page
- Embedding changelogs
- Instantly inform users about new changes in your app
- Nudge users to open the latest changes in your app and mark them as read
- Submitting bugs
- Set up a system so users can easily report a bug from within the app
Frequently asked questions