Remix and Strapi Crash Course – Full Stack Development

>> YOUR LINK HERE: ___ http://youtube.com/watch?v=5yIivwrvH6w

Learn how to use Remix and Strapi to build full stack applications. In this course, you'll discover how to harness the power of Remix, a modern React framework, to create dynamic, user-friendly front-end interfaces. And you'll learn to integrate Strapi, a flexible, open-source Headless CMS, to efficiently manage and deliver your content. • ✏️ Course created by ‪@CodingAfterThirty‬ • 💻 Code: https://github.com/PaulBratslavsky/fr... • ⭐️ Contents ⭐️ • (0:03:51) Introduction • (0:03:51) Prerequisites • (0:04:21) Setting up our project and overview • (0:07:03) Root route explained and linking our CSS • (0:08:22) Creating your first route and render via outlet • (0:10:36) Creating Dynamic Routes in Remix • (0:14:12) Setting up contact detail page • (0:15:08) Using the loader function to load data • (0:20:02) Loading single-user based on id via params • (0:24:48) Setting up Strapi, a headless CMS • (0:27:56) Strapi Admin overview and creating our first collection type • (0:33:20) Fetching all contacts from our Strapi endpoint • (0:38:17) Fetching single contact • (0:40:17) Adding the ability to add a new contact • (0:54:41) Form validation with Zod and Remix • (1:03:31) Adding the ability to update contact information • (1:16:25) Programmatic navigation using useNavigate hook • (1:18:15) Implementing the delete contact functionality • (1:25:53) Showing a fallback page when no items are selected • (1:27:25) Handling errors in Remix with error boundaries • (1:34:04) Implementing mark contact as a favorite • (1:37:33) Implementing search with Remix and Strapi filtering • (1:58:51) Submitting our form programmatically on input change • (2:00:39) Implementing loading state via useNavigation hook • (2:05:45) Project review and some improvement • (2:06:55) Styling active link in Remix • (2:09:17) Using useFetcher hook for form submission • (2:11:08) Throwing errors in Remix • (2:15:41) Closing thought and where to find hel • 🎉 Thanks to our Champion and Sponsor supporters: • 👾 davthecoder • 👾 jedi-or-sith • 👾 南宮千影 • 👾 Agustín Kussrow • 👾 Nattira Maneerat • 👾 Heather Wcislo • 👾 Serhiy Kalinets • 👾 Justin Hual • 👾 Otis Morgan • 👾 Oscar Rahnama • -- • Learn to code for free and get a developer job: https://www.freecodecamp.org • Read hundreds of articles on programming: https://freecodecamp.org/news • ❤️ Support for this channel comes from our friends at Scrimba – the coding platform that's reinvented interactive learning: https://scrimba.com/freecodecamp

#############################

New on site