Next BLOGFOLIO: Dark Mode with cookies & Suspense 🔴 Next.js & Chill
Let’s figure out how to do cool tech 🥳
We’re continuing our “Next.js & Chill” streams, where I focus on React/Next.js!
Our first project is updating my own site / portfolio / blog! Which is already a Next.js blog, so it shouldn’t be that big a leap… But we will be striving for the latest best practices, like the new app router, React Server Components and HTML streaming!
🚀 Check out the app yourself! https://magrippis.com/
💻 See the code, open-source and free: https://github.com/jmagrippis/magripp...
— COMMUNITY —
New DISCORD SERVER for us 😱: / discord
— 🥳🥳🥳 —
— PREVIOUSLY… —
✅ A new Next.js app with `npx create-next-app@latest``--experimental-app --typescript --tailwind` https://beta.nextjs.org/docs/installa...
✅ Turbopack, `app` directory, and other conventions I like: https://beta.nextjs.org/docs/routing/...
✅ Tailwind config with CSS Variables
✅ Font Optimisation: https://beta.nextjs.org/docs/optimizi...
✅ Awesome fonts by: https://etceteratype.co/ (and Google Fonts)
✅ Optimised images with https://beta.nextjs.org/docs/optimizi...
✅ File-based METADATA: https://beta.nextjs.org/docs/api-refe...
—— AGENDA ——
✅ Next.js? Blogfolio? What are we doing today?
✅ Dark Mode… with cookies! https://beta.nextjs.org/docs/api-refe...
✅ Setting the theme cookie with a Route Handler https://beta.nextjs.org/docs/routing/...
✅ Client-side toggling… with React Context? https://react.dev/learn/passing-data-...
✅ Faster page loads with streaming & parallel routes? https://beta.nextjs.org/docs/data-fet... & https://beta.nextjs.org/docs/routing/...
[ ] SVG Icons with @svgr/webpack… and turbopack?! https://turbo.build/pack/docs/feature...
——⬇️ BONUS ⬇️——
[ ] Analytics with Plausible
[ ] Typing animation
[ ] Workable design between OG https://magrippis.com/
[ ] MDX: Markdown-powered blogposts: https://beta.nextjs.org/docs/guides/mdx
[ ] Usage with MDX remote: https://github.com/hashicorp/next-mdx...
[ ] Infinite Magnetic Carousel
[ ] Sticky Header
[ ] Playwright setup
[ ] Mock Service Worker / MSW
[ ] Stripe Subscriptions
[ ] DB with Supabase
[ ] NEXT STEPS: Some of the “BONUS”s we didn’t get to? Let me know!
— HAVE FUN —
No affiliations whatsoever: if I show something, you know you're hearing my unfiltered thoughts 😄
— Highlighted software —
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 🙌
Watch video Next BLOGFOLIO: Dark Mode with cookies & Suspense 🔴 Next.js & 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 615 once and liked it 15 people.