Uploaded August 2024 | Updated September 2026, 2 weeks ago
Building an LMS ( Learning Management System ) with Remix, Shadcn UI, Tailwind, and Strapi 5, a headless CMS. Checkout Strapi 5 strp.cc/3YUHnT4
🔗 Frontend: github.com/PaulBratslavsky/remix-project-starter
🔗 Backend: github.com/PaulBratslavsky/strapi-lms-course-managment
In this video, I'll walk you through the project, show you how to set it up locally, and explain the technologies I'm using:
Frontend: Built with Remix for a seamless data-loading experience.
Backend: Powered by Strapi 5, a headless CMS I've used for years.
UI: Utilizing ShadCN UI with Tailwind CSS from Reweb and components from Vercel's v0 Ai-powered platform for quick prototyping.
Key Takeaways:
Get hands-on with Remix and Strapi 5.
Learn how to integrate ShadCN UI with Tailwind CSS.
Explore the process of setting up a full-stack project from scratch.
Understand the benefits of contributing to open-source projects.
If you enjoyed this video, please like, comment, and subscribe! If you didn't hit that dislike button – it's all good. 😄
Thank you all for your support, and I'll see you in the next video! 🚀
Building an LMS ( Learning Management System ) with Remix, Shadcn UI, Tailwind, and Strapi 5, a headless CMS. Checkout Strapi 5 strp.cc/3YUHnT4
🔗 Frontend: github.com/PaulBratslavsky/remix-project-starter
🔗 Backend: github.com/PaulBratslavsky/strapi-lms-course-managment
In this video, I'll walk you through the project, show you how to set it up locally, and explain the technologies I'm using:
Frontend: Built with Remix for a seamless data-loading experience.
Backend: Powered by Strapi 5, a headless CMS I've used for years.
UI: Utilizing ShadCN UI with Tailwind CSS from Reweb and components from Vercel's v0 Ai-powered platform for quick prototyping.
Key Takeaways:
Get hands-on with Remix and Strapi 5.
Learn how to integrate ShadCN UI with Tailwind CSS.
Explore the process of setting up a full-stack project from scratch.
Understand the benefits of contributing to open-source projects.
If you enjoyed this video, please like, comment, and subscribe! If you didn't hit that dislike button – it's all good. 😄
Thank you all for your support, and I'll see you in the next video! 🚀
![Strapi v5 Crash Course 2025 [ Part 1 Getting Started with Strapi ]](https://i.ytimg.com/vi/OrKLqITuhNA/mqdefault.jpg "Strapi v5 Crash Course 2025 [ Part 1 Getting Started with Strapi ]
Strapi tutorial part 1, we will look at what we will build and set up our initial Strapi project.
👉 Lesson Notes:: https://www.codingafterthirty.com/courses/strapi-5-crash-course-2025/getting-started-with-strapi-5-1
👉 Learn more about Strapi: https://strapi.link/learn-more
This is the only Strapi 5 tutorial you will ever need.
🚀 Strapi Course Overview – What You’ll Learn
Strapi is a powerful open-source headless CMS that allows you to fully control your content and APIs. This course is designed to help you understand how Strapi works and how to use it effectively in real-world projects.
What We’ll Cover:
- Setting up Strapi from scratch
- Creating and structuring content with collections, single types, and components
- Connecting Strapi to a frontend like Next.js or Astro
- Customizing Strapi to fit specific project needs
- Deploying and maintaining a Strapi project
Why use Strapi
Core Functionality
Strapi 5 is a headless CMS that represents content as API endpoints for front-end access, enabling non-technical users to manage website data through Dynamic Zones and blocks.
The Dynamic Pages feature empowers users to easily add new pages to the frontend by creating blocks with specific data types, facilitating the expansion of an Astro website.
Content Management
Strapis blocks concept allows developers to create various components with specific data types, enabling flexible content management for non-technical users through the Strapi admin interface.
Dynamic Zones break down each section of a page, allowing for easy management and updates through the Strapi admin, enhancing content flexibility.
API Integration
Strapi exposes API endpoints for seamless front-end access, which is demonstrated by making a GET request to the landing page endpoint for data rendering.
User-Friendly Interface
The content manager facilitates easy website data management by creating collections of different data types, such as Global and Landing Pages, with blocks representing various content elements.
By the end of this course, youll have a solid grasp of Strapi’s core features and how to integrate them into your workflow. Whether working on a personal project, building for clients, or scaling a larger application, this course will give you the tools you need.p")
![Implementing Auth With Next.js 15 and Strapi 5 Headless CMS [ Code Included ]](https://i.ytimg.com/vi/PL-IBGTwjxw/mqdefault.jpg "Implementing Auth With Next.js 15 and Strapi 5 Headless CMS [ Code Included ]
How to implement Auth with Next.js with Strapi.
👉🏻 Code on GitHub: https://github.com/PaulBratslavsky/strapi-auth-provider-demo-next-js
✨ Next.js and Strapi 5 Demo: https://strapi.link/strapi-and-nextjs
😅 My website: https://www.codingafterthirty.com
Lets work on setting up Next Auth with Next.js15 and Strapi 5. In this video we will take a look integrating GitHub Login in Your Next.js 15 App with Strapi 5 Backend.
Chapters
The video demonstrates how to implement GitHub authentication in a Next.js 15 application using Strapi 5, enabling automatic user creation and streamlined sign-in processes.
00:00 Implement authentication in Next.js 15 with Strapi 5 by integrating GitHub as a provider.
01:25 Using GitHub for authentication simplifies user sign-up by eliminating password management.
02:02 To set up GitHub authentication in Strapi, enable the GitHub provider.
05:27 Users can sign in with GitHub in a Next.js app using Strapi.
06:49 The implementation retrieves a JWT token from Strapi, validates it to fetch user data.
08:24 Explore GitHub social login implementation with Next.js 15 and Strapi 5 in a demo project.
Strapi 5 simplifies auth setup by allowing easy configuration of GitHub provider in settings, requiring only client ID, client secret, and frontend app URL.
Strapi automatically creates or authenticates users when they sign up/in through providers like GitHub, storing user data accessible via Next.js get user loader function.
Integration Process
Next.js route handler calls Strapis connect GitHub callback with the GitHub access token, resulting in user authentication and a JWT token set as an HTTP-only cookie.
Strapis settings page offers options to enable various auth providers (GitHub, Google) and restrict sign-up methods, enhancing security and user management.
Whether youre building a new app or enhancing an existing one, this approach simplifies user management!
What You’ll Learn
Overview of GitHub Authentication: Understand the benefits of using GitHub as an authentication provider.
Setting Up Strapi: Step-by-step instructions on configuring the GitHub provider in Strapi.
Next.js Route Handlers: Learn how to manage the redirect flow between GitHub and Strapi effectively.
User Management: Discover how Strapi 5 automatically creates and manages users based on GitHub logins.
Code Walkthrough: A comprehensive guide to the code structure, with a live demo of the application.
Key Takeaways
- Streamline user sign-ups by leveraging GitHub authentication.
- Minimize password management concerns with OAuth.
- Access to a complete code repository to kickstart your project.")
