Hosted on vercel
others / www.youtube.com2023-07-06

Create a Full Stack Realtime Chat Messaging App with Remix.run

Join me in this exciting coding tutorial as we dive into the world of full stack development! In this video, we'll be creating a feature-rich chat messaging application using Remix.run using the power of Server-Sent Events. ๐Ÿ‘จ๐Ÿปโ€๐Ÿ’ปGithub Repository: https://github.com/ski043/remix-chat-yt ๐Ÿ‘จ๐Ÿปโ€๐Ÿ’ป Ressources used: Remix.run: https://remix.run/ Tailwind.css: https://tailwindcss.com/ Remix-Auth docs: https://remix-docs-flame.vercel.app/ Timestamps 00:00 Intro 00:25 Demo 01:05 Installation 09:00 Setup Prisma 15:10 Coding Application @Remix-Run @TailwindLabs #tailwindcss #react

others / www.youtube.com2023-05-17

"Web beyond the edge" by Igor Minar & Nevi Shah at #RemixConf 2023 ๐Ÿ’ฟ

Edge computing is increasingly being adopted by web developers these days to improve UX and decrease latency of their applications. Cloudflare Workers, Deno Deploy, Netlify Edge Functions, and Vercel Edge Functions, all have made edge computing available to developers of full stack applications. With this adoption new architectural patterns and anti-patterns for building web applications have emerged. In this talk weโ€™ll cover how developers can utilize edge computing to build full-stack applications and what are the strengths and weaknesses of this approach. Weโ€™ll also look into the future โ€” beyond the edge, and explore how thinking of the network as the computer will fundamentally change the architecture of web applications in order to make building planet-scale applications accessible to everyone. Speaker Bio: Nevi Shah is a Product Manager at Cloudflare. She works on Cloudflare Pages and Cloudflare D1. https://remix.run/conf/2023/speakers/nevi-shah Speaker Bio: Igor Minar is a software engineer at Cloudflare and co-creator of AngularJS, Angular, and Karma. He has spent the last 15 years helping developers by building infrastructure, APIs, and tooling for the Web. Igor built some of the biggest web development communities during his time at Google. He collaborated with the TypeScript team to bring type-checking and better tooling to developers, as well as browser vendors to design and improve web APIs. He has also worked to establish pragmatic best practices in the web ecosystem by creating conventional commits and many evergreen libraries. https://remix.run/conf/2023/speakers/igor-minar

others / egghead.io2022-12-16

Build a Realtime Chat App with Remix and Supabase

Supabase is a collection of open-source tools that wrap around a PostgreSQL database. In this course, we look at building a realtime chat application with Remix, using Supabase for db hosting, authentication, authorization and subscribe to realtime db events - updating the UI as the database changes. We will learn about: loaders and actions in Remix querying and mutating data with Supabase authentication with GitHub authorization with RLS merging client and server state with realtime events deploying a Remix app to Vercel This course is 100% TypeScript, however, don't stress if you don't have any experience with TS, as Supabase does most of the heavy lifting here! ๐ŸŽ‰

others / egghead.io2022-05-25

Learn Remix by Building a Social Media Platform with TypeScript and Prisma

Remix takes a more traditional approach to web development, it embraces the Client/Server model and by doing so unlocks the web platform in ways you might not be used to. You'll find yourself not reaching for global state management as much (try not to when you first start out!) because you have access to what's on the server readily available to you anywhere in your application, database and all. In addition to state management adjustments, you'll also find yourself using actual platform API like Forms and the Web Fetch API. Along with Remix, Ian utilizes TypeScript, Prisma, PlanetScale, and Vercel in this course for a truly wonderful developer experience. Prisma + TypeScript make it easy to model and validate all the data flowing through your application. With Prisma set up, you'll find switching to a deployed, production database is a breeze (no really) with PlanetScale. Tying it all together is Vercel which plays nice with GitHub and PlanetScale for easy deploys. With this stack, you will build out an MVP for a social media type application. Youโ€™ll start your journey by building out the more static parts of your application, introducing you to Remix API and Patterns along the way. As you get familiar with these API and Patterns Ian will introduce you to more complex features. This includes user authentication through cookie session storage and implementing an authentication strategy (which again, is a lot more pleasant than it sounds with Remix!).

others / www.youtube.com2022-05-19

Why you should lift component state up to the URL

"How can I sync component state with the URL?" This is one of the most common questions I see asked in the React community, and in this video we're going to learn why trying to synchronize state between your React app and the URL is a bad idea โ€“ and the right way to address this issue. - 0:00 โ€“ Intro - 2:04 โ€“ Implementing sorting in React - 17:06 โ€“ First attempt at shareable URLs: Synchronizing React state - 20:17 โ€“ Fundamental problem with first attempt - 21:43 โ€“ย Second attempt at shareable URLS: Hoist state out of React - 29:13 โ€“ย Outro Links: ๐Ÿ‘‰ Demo: https://2022-05-16-hoisting-state-to-url.vercel.app ๐Ÿง‘โ€๐Ÿ’ป Source on GitHub: https://github.com/samselikoff/2022-05-16-hoisting-state-to-url/blob/main/app/routes/index.jsx ๐Ÿ’… Table component from Tailwind UI: https://tailwindui.com/components/application-ui/lists/tables#component-7b5a46e74e475708d966ca31716f1771