INTRODUCING
#THEFUTUREISWRITTENINCODE

Form Validation In Remix Using Yup #remix #formvalidation #reactjs Remix is a full-stack web framework that lets you focus on the user interface and work back through web fundamentals to deliver a fast, slick, and resilient user experience. People are gonna love using your stuff. Simple application showing form validation in Remix using Yup Remix Playlist - https://buff.ly/3GuKVPS ------------------------------------------------------------------------------ 💰 Support this channel - https://ko-fi.com/fiwic ------------------------------------------------------------------------------ Follow Me ------------------------------------------- twitter - https://twitter.com/aaronksaunders github - https://github.com/aaronksaunders udemy - https://www.udemy.com/user/aaronsaunders gumroad - https://app.gumroad.com/fiwic Links --------- Remix Docmentation - https://remix.run/docs/en/v1 Yup Documentation - https://github.com/jquense/yup Remix Playlist - https://buff.ly/3GuKVPS #reactremix #remixrun

How To Upload Files To Supabase Storage Buckets and Write Data To Supabase Using Remix #remix #supabase #reactjs Remix is a full-stack web framework that lets you focus on the user interface and work back through web fundamentals to deliver a fast, slick, and resilient user experience. People are gonna love using your stuff. Simple application showing authentication flow and session management using react remix and supabase. This second video shows how to write new data records to supabase and how to upload files to supabase storage buckets Timestamps -------------------- 00:00 - What's Covered In The Tutorial 01:34 - Walking Through the App 02:58 - Looking At New Record Route To Add Record To Database 06:14 - Show File Upload Changes In Supabase Policy 07:39 - Looking At File Upload Route To Upload File To Supabase ------------------------------------------------------------------------------ 💰 Support this channel - https://ko-fi.com/fiwic ------------------------------------------------------------------------------ Follow Me ------------------------------------------- twitter - https://twitter.com/aaronksaunders github - https://github.com/aaronksaunders udemy - https://www.udemy.com/user/aaronsaunders gumroad - https://app.gumroad.com/fiwic Links --------- Remix Docmentation - https://remix.run/docs/en/v1 Supabase Documentation - https://supabase.com/ Source Code - https://github.com/aaronksaunders/supabase-remix-auth Supabase Playlist - https://youtu.be/MVy46MGmfOQ Adding Tailwind to Remix - https://www.better.dev/adding-tailwind-css-to-remix #reactremix #remixrun

Ionic Framework v6 VueJS And Firebase - Authentication Flow Using Pinia For State Management #vuejs #pinia #firebase #ionicframework Source code walkthrough for a template for vuejs authentication flow using the latest firebase version, latest ionic framework version 6, and Pinia for State Management. We are also using the newest version of Firebase in this template, the APIs have changed a bit but the examples in the application try to make it easier Show how to manage the authentication flow with state management in Pinia, keep the user state and profile information there. Manage authentication guards in the vuejs router utilizing state variables and updating data in your application views as the data is refreshed in firebase. ------------------------------------------------------------------------------ 💰 Support this channel - https://ko-fi.com/fiwic ------------------------------------------------------------------------------ Follow Me ------------------------------------------- twitter - https://twitter.com/aaronksaunders github - https://github.com/aaronksaunders udemy - https://www.udemy.com/user/aaronsaunders gumroad - https://app.gumroad.com/fiwic Links --------- - Pinia Video - https://youtu.be/sKGh2wp4QfM - Pinia Documentation - https://pinia.vuejs.org/ - Source - https://github.com/aaronksaunders/ionic-v6-firebase-tabs-auth

MongoDB Realm and React Native Getting Started - Adding the User Interface #mongodb #realmdb #reactnative In the first video, we showed all of the CRUD actions and in this video, we will put a basic user interface on the application and integrate a list of tasks and a way to add and delete the items. The User Interface is build using React Native Paper This is a series of videos about using MongoDB Realm React Native specifically taking advantage of the offline and sync capabilities. I have used MongoDB realm once before in an Ionic Framework video series listed below, so you can take a look to get an idea of the direction I am heading with this video series As we move through the series we will fill out the app more and show how to integrate MongoDB Realm in a React Native application. ------------------------------------------------------------------------------ 💰 Support this channel - https://ko-fi.com/fiwic ------------------------------------------------------------------------------ Series ----------- Part 1 - CRUD Actions - https://youtu.be/1Ys-dKX_OyU Part 2 - User Interface- https://youtu.be/UdtgVJ_75W8 Part 3 - Synchronization of Data ( Coming Soon...) Links -------- - React Native Playlist - https://youtube.com/playlist?list=PL2PY2-9rsgl1B3ydONg0RqjOM9-0oS0cm - Source Code https://github.com/aaronksaunders/MyReactNativeRealmApp/tree/master - Realm Documentation https://docs.mongodb.com/realm/

Using NEW Amplify UI Authenticator Component In VueJS with Ionic Framework #vuejs #aws #awsamplify 🕤 Timestamps ------------------------- 00:00 - Intro 02:06 - The Code, Amplify Doc Sample Overview 03:30 - Our Code and Our Approach 05:20 - Customizing Fields and Header in UI 06:30 - Adding Additional Attribute Fields When Creating A User 07:26 - Renaming Fields and Labels 09:30 - Listening For Authentication Events From Amplify 11:00 - Using Events to Update Authentication State in Pinia 13:00 - Implementing Signout 15:17 - Implementing SignIn and Email Confirmation ------------------------------------------------------------------------------ 💰 Support this channel - https://ko-fi.com/fiwic ------------------------------------------------------------------------------ Follow Me ------------------------------------------- twitter - https://twitter.com/aaronksaunders github - https://github.com/aaronksaunders udemy - https://www.udemy.com/user/aaronsaunders gumroad - https://app.gumroad.com/fiwic 🔗 Links -------------- - setup: https://docs.amplify.aws/cli/start/install/ - doc: https://ui.docs.amplify.aws/?platform=vue - code: https://github.com/aaronksaunders/amplify-new-ui - pinia state management: https://youtu.be/sKGh2wp4QfM

Thanks For Your Support, I am a New YouTube Partner - December 13, 2021 ------------------------------------------------------------------------------ 💰 Support this channel - https://ko-fi.com/fiwic ------------------------------------------------------------------------------ Follow Me ------------------------------------------- twitter - https://twitter.com/aaronksaunders github - https://github.com/aaronksaunders udemy - https://www.udemy.com/user/aaronsaunders gumroad - https://app.gumroad.com/fiwic

React Native - Supabase Video Tutorial, Tesla Charger Diary Application: User Management #supabase #reactnative #tutorial This is the second video in the series of React Native and Supabase. - Part 1: https://www.youtube.com/watch?v=254ybVXJOec In this video, we implement account creation and user sign in 🕑 Timestamps ------------------------- 00:00 - Intro 00:20 - Supbase Documentation, Setting Up Email Sign Up 01:56 - Back In The Code, Modify Navigation Stack For Authentication 04:09 - Using SignIn API Call in Our Client Library 05:32 - Integrate New API Call in Login Function In UI 08:01 - Listening For Authentication Session Changes 11:12 - Modify Navigation Stack For Create Account 14:25 - Using SignUp API Call in Our Client Library 14:47 - Creating A New Table In Supabase 15:48 - Using Insert API for Inserting New Record for User In Profile 20:13 - Testing Create Account 22:25 - Adding Logout Functionality In UI ------------------------------------------------------------------------------ 💰 Support this channel - https://ko-fi.com/fiwic ------------------------------------------------------------------------------ 🔗 Links ------------- - Supabase: https://supabase.com/ - Expo: https://docs.expo.dev/ - React Native Paper: https://reactnativepaper.com/ - React Navigation: https://reactnavigation.org/ - Url Polyfill - https://github.com/facebook/react-native/issues/23922#issuecomment-648096619 - AsyncStorage - https://github.com/supabase/supabase-js/issues/135 - Source Code: https://github.com/aaronksaunders/sb-rn-chargers

React Native - Supabase Video Tutorial, Tesla Charger Diary Application #supabase #reactnative #tutorial This is a video tutorial using React Native, Expo, React Native Paper, React Navigation and Supabase. I am build a simply Tesla Supercharger Application to track the Supercharger Locations along the Washington DC to NYC route so that I know what services are really available, which side of the highway the chargers are and other important information to make it easier for my trip. This first video is over an hour long so I will be dropping additional video "Extras" to fill out the missing content. We will include Map Integration, Image Upload and if you have other ideas, please leave a comment below. ALL the source code is included with this video. 🕑 Timestamps ------------------------- 00:00 - Intro - what we are doing and brief Supabase overview 01:59 - Walkthrough The Tesla Charger Diary App 03:22 - Tools and Libraries, Supabase, React Native Paper & React Navigation 04:25 - Database Schema and SQL Scripts Explanations 08:37 - Walking through Application Scaffolding 09:47 - Authentication Navigation Flow, AuthStack.js 12:20 - Main Application Navigation Flow, HomeStack.js 15:50 - Integrating Supabase Into Application 18:11 - Getting Charger Data From Table and Rendering In User Interface 25:00 - Getting Specific Charger By Id with Related Table Data and Rendering In User Interface. Passing Route Parameters, Navigating to Detail Screens 32:58 - Rendering the Related Table Data for Notes, Services & CheckIns in the User Interface 39:37 - Saving Charger Data In Supabase, Integrating Modal in User Interface 49:14 - Subscribing to Changes In Charger Table to Update User Interface 53:37 - Integrating Modal from the Beginning To Add Services to a Specific Charger. Adding Records to Related Tables ------------------------------------------------------------------------------ 💰 Support this channel - https://ko-fi.com/fiwic ------------------------------------------------------------------------------ Coming Soon - Leave Comment On What You Would Like To See ------------------------------------------------------------------------------------------------------- - Login & User Management - https://youtu.be/-WWbhITh_Go - Row Level Security - Image Upload - Map Integration 🔗 Links ------------- - Supabase: https://supabase.com/ - Expo: https://docs.expo.dev/ - React Native Paper: https://reactnativepaper.com/ - React Navigation: https://reactnavigation.org/ - Url Polyfill - https://github.com/facebook/react-native/issues/23922#issuecomment-648096619 - AsyncStorage - https://github.com/supabase/supabase-js/issues/135 - Source Code: https://github.com/aaronksaunders/sb-rn-chargers

Creating An Authentication Flow Using Remix and Supabase Tutorial #remix #supabase #reactjs Remix is a full-stack web framework that lets you focus on the user interface and work back through web fundamentals to deliver a fast, slick, and resilient user experience. People are gonna love using your stuff. Simple application showing authentication flow and session management using react remix and supabase See Part Two where we cover file upload and writing records to Supabase - https://youtu.be/ySQcGc9NICo Timestamps -------------------- 00:00 What's Covered In The Tutorial 02:15 Application Feature Walkthru 03:19 Looking At Code Starting With index.js, Covering Actions & Loaders Sessions 07:38 Managing Sessions in Authentication Session Using Remix 08:40 Logging In A User In Supabase and Creating the Session 12:18 Creating A New User Account In Supabase and Creating A Session 14:40 Running The Project 15:13 Using Remix Server 15:34 Configuring Environment With .env 16:16 Running Remix App and Verifying Data In Supabase 18:02 Final Thoughts ------------------------------------------------------------------------------ 💰 Support this channel - https://ko-fi.com/fiwic ------------------------------------------------------------------------------ Follow Me ------------------------------------------- twitter - https://twitter.com/aaronksaunders github - https://github.com/aaronksaunders udemy - https://www.udemy.com/user/aaronsaunders gumroad - https://app.gumroad.com/fiwic Links --------- Remix Docmentation - https://remix.run/docs/en/v1 Supabase Documentation - https://supabase.com/ Source Code - https://github.com/aaronksaunders/supabase-remix-auth Supabase Playlist - https://youtu.be/MVy46MGmfOQ #reactremix #remixrun