Learn localStorage in JavaScript by building a project! Max Programming 2026-09-20 | Learn localStorage in JavaScript by building a project!
User Authentication For Beginners | From Sign Up To Sign In | JWT Max Programming 2025-06-02 | Hello, my friends and fellow developers!In this video, we cover how basic user authentication is handled from signing up to signing in. Covering hashing passwords, using JWTs!Let me know in the comments below if you want more authentication content or something else.Websites used:Bcrypt Generator: bcrypt-generator.comJWT: jwt.ioDiagrams:Sign Up: view.usmans.me/sign-up-diagramSign In: view.usmans.me/sign-in-diagramUser Profile (Protected Route): view.usmans.me/user-profile-protected-route-diagramTimestamps:00:00 - Introduction00:28 - Sign up01:12 - Password hashing03:59 - Sign in04:42 - Finding the user by email05:11 - Checking the password06:36 - Authenticating the user07:31 - JSON web tokens (JWTs)08:43 - Generating a JWT10:48 - Identifying user with JWT12:44 - Verifying the JWT15:28 - Going through the implementation15:48 - Sign up demo16:12 - Sign up implementation and code17:24 - Sign in demo17:58 - Sign in implementation and code20:47 - Protected endpoint demo21:28 - Protected endpoint code with middleware23:25 - ConclusionOther Tutorials: ⚛️ React and Material UI Todo App: bit.ly/reactmattodo 🟨 Other JavaScript videos: bit.ly/jstutorials 📘 Visual Studio Code videos: bit.ly/vscodevids 🔋 Build a Battery App in JS: youtu.be/J8_hwKSeffYConnect 🔗 : Twitter: twitter.com/MaxProgramming1 Facebook: facebook.com/Max-Programming-103081931147293 Github: github.com/max-programmingVS Code Theme used: Default Dark ModernSuggest, ask doubts in the comments and share these videos to help!Thanks for Watching!#authentication #javascript #backend
You’re MISSING OUT Without Git Max Programming 2025-05-22 | Hello, my friends and fellow developers!In this video, we cover why Git is an essential tool for you to learn, what it is, some misconceptions, and from where to learn it.Git Tutorial For Dummies by Nick White: youtu.be/mJ-qvsxPHpYLet me know in the comments below if you want more Git content or something else.Other Tutorials: ⚛️ React and Material UI Todo App: bit.ly/reactmattodo 🟨 Other JavaScript videos: bit.ly/jstutorials 📘 Visual Studio Code videos: bit.ly/vscodevids 🔋 Build a Battery App in JS: youtu.be/J8_hwKSeffYConnect 🔗 : X: https://x.com/MaxProgramming1 GitHub: github.com/max-programmingSuggest, ask doubts in the comments and share these videos to help!Thanks for Watching!#git #programming #coding
Learn React Custom Hooks With Real-World Examples Max Programming 2024-11-16 | Hello, my friends and fellow developers!In this video, we cover how you can create and use custom hooks in React!Let me know in the comments below if you want more React content or something else.Relevant tutorials: JavaScript Destructuring: youtu.be/_Za-zFpzk2A React useEffect Hook: youtu.be/sfMgdyshCLk TypeScript Generics: youtu.be/7GgdPgVRowwWebsites mentioned in video: usehooks-ts: usehooks-ts.com usehooks (by ui.dev): usehooks.comTimestamps:00:00 - Introduction00:32 - Feature overview00:45 - Why custom hooks?01:26 - Creating the custom hook02:49 - Logic inside the custom hook07:12 - Advanced and real-world example08:52 - The custom useFetch hook10:58 - Using the useFetch hook13:46 - Custom hooks websites and libraries14:56 - ConclusionOther Tutorials: ⚛️ React and Material UI Todo App: bit.ly/reactmattodo 🟨 Other JavaScript videos: bit.ly/jstutorials 📘 Visual Studio Code videos: bit.ly/vscodevids 🔋 Build a Battery App in JS: youtu.be/J8_hwKSeffYConnect 🔗 : Twitter: twitter.com/MaxProgramming1 Facebook: facebook.com/Max-Programming-103081931147293 Github: github.com/max-programmingVS Code Theme used: Default Dark ModernSuggest, ask doubts in the comments and share these videos to help!Thanks for Watching!#reactjs #javascript #typescript
How To Become A Full Stack Web Developer | A Step By Step Guide Max Programming 2024-09-29 | Hello, my friends and fellow developers!This video is about how you can become a full stack web developer in today's time. What challenges will you face, what path should you go through, etc🎁 Create a free Scrimba account and with this link and get a 20% discount whenever you upgrade: v2.scrimba.com/?via=maxprogrammingLinks mentioned in the video: Scrimba Frontend Developer Career Path: v2.scrimba.com/the-frontend-developer-career-path-c0j?via=maxprogramming BroCode: youtube.com/BroCodez CodeWars: codewars.com Git Crash Course: youtu.be/mJ-qvsxPHpYLet me know in the comments below if you want more talking head content or something else.Timestamps:00:00 - Introduction01:20 - Phase 1: Programming02:07 - Learn the basics of computers02:37 - Pick a programming language05:19 - Where to learn programming?05:31 - Where to practice programming?06:01 - Phase 2: Frontend06:40 - Frontend framework hell07:15 - Where to learn frontend?08:53 - Learning a frontend framework09:32 - How long will it take?10:16 - Learn Git & GitHub11:13 - Phase 3: Backend11:38 - Learn about HTTP & REST APIs12:05 - Databases SQL & NoSQL13:07 - Using backend frameworks13:27 - Authentication & Authorization14:05 - Additional backend tech14:22 - Deploying a backend14:48 - Some advice and tips18:18 - ConclusionOther Tutorials: ⚛️ React and Material UI Todo App: bit.ly/reactmattodo 🟨 Other JavaScript videos: bit.ly/jstutorials 📘 Visual Studio Code videos: bit.ly/vscodevids 🔋 Build a Battery App in JS: youtu.be/J8_hwKSeffYConnect 🔗 : Twitter: twitter.com/MaxProgramming1 Facebook: facebook.com/Max-Programming-103081931147293 Github: github.com/max-programmingI suggest asking questions in the comments and sharing these videos to help!Thanks for Watching!#webdev #programming #javascript
How to use Drizzle ORM in Next.js App Router | Explained with project Max Programming 2024-08-13 | Hello, my friends and fellow developers!In this video, we cover how you can set up and use Drizzle ORM with Next.js App Router also utilising react server components & server actions! We understand by an example of a contact form.Let me know in the comments below if you want more Next.js & Drizzle ORM content or something else.Links mentioned in the video: Drizzle Docs: https://orm.drizzle.team/docs/overview Next.js Server Actions: nextjs.org/docs/app/building-your-application/data-fetching/server-actions-and-mutations GitHub Repo: github.com/max-programming/drizzle-nextjs reCAPTCHA v3 video: youtu.be/w-EbCTxI47o00:00 - Intro00:15 - Project starter walkthrough01:33 - Install Drizzle & SQLite dependencies02:50 - Drizzle config file04:54 - Creating a table06:48 - Generating and running migrations09:22 - Connecting to the DB10:10 - Contact form server action13:58 - Fetching responses from DB14:59 - Use types from drizzle15:32 - Add more responses15:44 - Delete response server action17:14 - Fixing error using bind method18:18 - Test the project18:48 - ConclusionOther Tutorials: ⚛️ React and Material UI Todo App: bit.ly/reactmattodo 🟨 Other JavaScript videos: bit.ly/jstutorials 📘 Visual Studio Code videos: bit.ly/vscodevids 🔋 Build a Battery App in JS: youtu.be/J8_hwKSeffYConnect 🔗 : Twitter: twitter.com/MaxProgramming1 Facebook: facebook.com/Max-Programming-103081931147293 Github: github.com/max-programmingVS Code Theme used: Default Dark ModernSuggest, ask doubts in the comments and share these videos to help!Thanks for Watching!#nextjs #reactjs #programming
Strongly typed links in Next.js 💪 Max Programming 2024-08-13 | #shorts #javascript #nextjs #typescript
Racing Promises in JavaScript 🏎️ #shorts Max Programming 2024-08-09 | #javascript #typescript #reactjs
How To Use Google reCAPTCHA v3 in Next.js 15 With Server Actions? Max Programming 2024-08-07 | Hello, my friends and fellow developers!In this video, we cover how you can use Google's reCAPTCHA v3 in your Next.js 15 project and how you can use it with server actions!I also explained how it works behind the scenes and we don't use any external library for this use-caseLet me know in the comments below if you want more Next.js content or something else.Links mentioned in the video: GitHub Repo: github.com/max-programming/recaptcha-v3-actions reCAPTCHA V3 Docs Client Side: developers.google.com/recaptcha/docs/v3 reCAPTCHA V3 Docs Server Side: developers.google.com/recaptcha/docs/verify Google Sheets Tutorial: youtu.be/0h4c3WuAYZETimestamps:00:00 - Intro00:15 - Register in admin console01:56 - Starter project walkthrough03:03 - How reCAPTCHA works05:27 - Environment variables07:06 - grecaptcha types package07:39 - Adding reCAPTCHA script09:55 - Generate reCAPTCHA token in client side17:44 - Verify reCAPTCHA token in server action23:17 - Creating types for token verification response25:25 - Continue server action27:14 - Show success or error on frontend27:46 - Adding types for error codes28:22 - Test handling of errors28:55 - ConclusionOther Tutorials: ⚛️ React and Material UI Todo App: bit.ly/reactmattodo 🟨 Other JavaScript videos: bit.ly/jstutorials 📘 Visual Studio Code videos: bit.ly/vscodevids 🔋 Build a Battery App in JS: youtu.be/J8_hwKSeffYConnect 🔗 : Twitter: twitter.com/MaxProgramming1 Facebook: facebook.com/Max-Programming-103081931147293 Github: github.com/max-programmingVS Code Theme used: Default Dark ModernSuggest, ask doubts in the comments and share these videos to help!Thanks for Watching!#nextjs #reactjs #javascript
Rolling my own auth - Building an Authentication API with Nest.js [LIVE Stream] Max Programming 2024-06-04 | In this live stream, I'll be building a REST API with user authentication and will try to add complete feature set of user auth in it.#nestjs #react #javascript #typescript
Build A Responsive Sidebar using Next.js 15, React, shadcn/ui, and Tailwind CSS Max Programming 2024-03-30 | Hello, my friends and fellow developers!In this video, we cover how you can build a Responsive Sidebar using Next.js 15 app router, React, shadcn/ui, and Tailwind CSS! This is the continuation of the previous video on how to build a sidebar using Next.js and shadcn/uiPrevious video: youtu.be/-vD8DAEEEWELet me know in the comments below if you want more Next.js content or something else.GitHub Repo: github.com/max-programming/shadcn-sidebar00:00 - Introduction & Setup01:39 - Using Media Query in React03:32 - Sidebar Mobile Component05:31 - Fixing Hydration Error in Next.js08:15 - Continue Sidebar Mobile08:38 - Hide Close Button in Sheet10:45 - Sheet Header and some styles13:35 - Icon button to open sidebar14:44 - Fix margins on mobile view15:51 - Displaying links in sidebar content19:53 - Sidebar bottom items in a Drawer24:05 - ConclusionOther Tutorials: ⚛️ React and Material UI Todo App: bit.ly/reactmattodo 🟨 Other JavaScript videos: bit.ly/jstutorials 📘 Visual Studio Code videos: bit.ly/vscodevids 🔋 Build a Battery App in JS: youtu.be/J8_hwKSeffYConnect 🔗 : Twitter: twitter.com/MaxProgramming1 Facebook: facebook.com/Max-Programming-103081931147293 Github: github.com/max-programmingSuggest, ask doubts in the comments and share these videos to help!Thanks for Watching!#nextjs14 #reactjs #javascript
Build A Twitter Sidebar using Next.js 15, React, shadcn/ui, and Tailwind CSS Max Programming 2024-02-28 | Hello, my friends and fellow developers!In this video, we cover how you can build a Twitter Sidebar using Next.js 15 app router, React, shadcn/ui, and Tailwind CSS!Let me know in the comments below if you want more Next.js content or something else.GitHub Repo: github.com/max-programming/shadcn-sidebarNext part: youtu.be/FYBC3TjRULoTimestamps:00:00 - Intro & Sidebar Demo00:36 - Create Next App01:18 - Setup shadcn/ui and theme02:53 - Home Page & darkmode04:08 - Adding components from shadcn/ui05:30 - Sidebar component09:34 - Sidebar Button component17:03 - Adding sidebar links19:42 - Use Link component for navigation20:17 - Fix a bug caused by client-server components22:28 - Adding all sidebar links25:10 - Adding additional sidebar items28:05 - Sidebar footer with popover33:22 - Adding page with dynamic routes35:15 - Highlighting active link in sidebar36:13 - ConclusionOther Tutorials: ⚛️ React and Material UI Todo App: bit.ly/reactmattodo 🟨 Other JavaScript videos: bit.ly/jstutorials 📘 Visual Studio Code videos: bit.ly/vscodevids 🔋 Build a Battery App in JS: youtu.be/J8_hwKSeffYConnect 🔗 : Twitter: twitter.com/MaxProgramming1 Facebook: facebook.com/Max-Programming-103081931147293 Github: github.com/max-programmingSuggest, ask doubts in the comments, and share these videos to help!Thanks for Watching!#nextjs14 #reactjs #javascript
Learn Search Params in Next.js 14 by building a project! React | Tailwind | shadcn/ui Max Programming 2024-02-15 | Hello, my friends and fellow developers!In this video, we cover how you can use query search params effectively in the Next.js 14 app router by building a little project! We also use Tailwind CSS, shadcn/ui, and TypeScript!Let me know in the comments below if you want more Next.js content or something else.🔗 Links in the videoSource Code: github.com/max-programming/shadcn-tabs-queryShadcn UI: ui.shadcn.comUsehooks TS: usehooks-ts.comTimestamps:00:00 - Introduction & Demo01:12 - Next.js and shadcn/ui components02:00 - Adding Tabs04:36 - Search param for the active tab11:52 - Adding the search bar input12:57 - Using hooks by Next.js15:11 - Changing search params with input21:09 - Deleting a search param22:15 - Setting a default value for input23:15 - BONUS - DebouncingOther Tutorials: ⚛️ React and Material UI Todo App: bit.ly/reactmattodo 🟨 Other JavaScript videos: bit.ly/jstutorials 📘 Visual Studio Code videos: bit.ly/vscodevids 🔋 Build a Battery App in JS: youtu.be/J8_hwKSeffYConnect 🔗 : Twitter: twitter.com/MaxProgramming1 Facebook: facebook.com/Max-Programming-103081931147293 Github: github.com/max-programmingSuggest, ask doubts in the comments, and share these videos to help!Thanks for Watching!#reactjs #nextjs14 #nextjs13 #javascript
BigInt in JavaScript 🔢 #typescript #coding #javascript Max Programming 2024-02-14 | When number can't handle the overflowBigint is the way to go
null vs undefined #javascript #typescript #webdevelopment #shorts Max Programming 2024-02-12 | Null is the empty box, a nothing you see,While undefined whispers, "Hey, that's not me!"
You probably dont know these 5 TypeScript utility types Max Programming 2024-02-05 | Hello, my friends and fellow developers!In this video, we cover the top 5 rare but incredibly useful utility types in TypeScript!Let me know in the comments below if you want more TypeScript content or something else.TypeScript Utility types docs: typescriptlang.org/docs/handbook/utility-types.htmlTimestamps:0:00 - Introduction0:43 - Parameters1:44 - ReturnType2:25 - Awaited3:06 - NonNullable3:49 - Record5:16 - ConclusionOther Tutorials: ⚛️ React and Material UI Todo App: bit.ly/reactmattodo 🟨 Other JavaScript videos: bit.ly/jstutorials 📘 Visual Studio Code videos: bit.ly/vscodevids 🔋 Build a Battery App in JS: youtu.be/J8_hwKSeffYConnect 🔗 : Twitter: twitter.com/MaxProgramming1 Facebook: facebook.com/Max-Programming-103081931147293 Github: github.com/max-programmingVS Code Theme used: Default Dark ModernSuggest, ask doubts in the comments, and share these videos to help!Thanks for Watching!#typescript #javascript #webdevelopment
All you need to know about Hacktoberfest 2023 | No T-Shirt 😱 ? Max Programming 2023-09-24 | Hello, my friends and fellow developers!In this video, we cover how you can participate in Hacktoberfest and contribute to open source! We will get into the details of Hacktoberfest and what is different this time...Let me know in the comments below if you want more open-source content or something else.Hacktoberfest is DigitalOcean’s annual event that encourages people to contribute to open source throughout October. Much of modern tech infrastructure—including some of DigitalOcean’s own products—relies on open-source projects built and maintained by passionate people who often don’t have the staff or budgets to do much more than keep the project alive. Hacktoberfest is all about giving back to those projects, sharpening skills, and celebrating all things open source, especially the people that make open source so special.Hacktoberfest: hacktoberfest.comProject Finder: finder.usmans.meGit For Dummies by @NickWhite - youtu.be/mJ-qvsxPHpYHow to make a pull request - youtu.be/RjxDDhMqwrM🔥 Timestamps Start 🔥00:00 - Intro & About Hacktoberfest00:36 - Hacktoberfest 2023 Participation And Rules01:40 - Rewards this year - No T-Shirt?02:27 - Benefits of participating03:54 - If you don't know Git and GitHub04:32 - How to find the right projects and tasks?07:16 - Conclusion🔥 Timestamps End 🔥Other Tutorials: ⚛️ React and Material UI Todo App: bit.ly/reactmattodo 🟨 Other JavaScript videos: bit.ly/jstutorials 📘 Visual Studio Code videos: bit.ly/vscodevids 🔋 Build a Battery App in JS: youtu.be/J8_hwKSeffYConnect 🔗 : Twitter: twitter.com/MaxProgramming1 Facebook: facebook.com/Max-Programming-103081931147293 Github: github.com/max-programmingSuggest, ask doubts in the comments and share these videos to help!Thanks for Watching!#hacktoberfest #github #opensource
Converting a Figma design to Next.js with Tailwind CSS [LIVE Stream] Max Programming 2023-06-06 | In this live stream, we'll convert a Figma design to a Next.js application using Tailwind CSS. Join this fun ride.#nextjs #react #javascript
Exploring SvelteKit [LIVE Stream] Max Programming 2023-05-12 | We are exploring SvelteKit and building something with it...#javascript #html #css
How to use Credentials Authentication in Next.js with NextAuth? Max Programming 2023-05-07 | Hello, my friends and fellow developers!In this video, we cover how you can set up the Credentials Provider by NextAuth properly in your Next.js app! We also use Prisma, Zod, and TypeScript to the mixLet me know in the comments below if you want more Next.js content or something else.GitHub Repository - github.com/max-programming/auth-creds-tutorialNextAuth Prisma Adapter - https://authjs.dev/reference/adapter/prisma🔥 Timestamps Start 🔥00:00 - Intro00:30 - Create Next App01:14 - Setup Prisma with SQLite03:34 - Install NextAuth + Other Dependencies04:06 - User Registration API10:13 - NextAuth - Create API Route11:36 - NextAuth - Credentials Provider16:38 - NextAuth - Callbacks19:21 - NextAuth - Pages19:43 - NextAuth - Session Strategy19:57 - NextAuth - JWT Secret20:23 - Working on the frontend20:56 - Register Page Functionality26:12 - Open Prisma Studio26:30 - Display logged-in user on the homepage29:28 - Login Page Functionality30:40 - Fixing a TypeScript error31:22 - Conclusion🔥 Timestamps End 🔥Other Tutorials: ⚛️ React and Material UI Todo App: bit.ly/reactmattodo 🟨 Other JavaScript videos: bit.ly/jstutorials 📘 Visual Studio Code videos: bit.ly/vscodevids 🔋 Build a Battery App in JS: youtu.be/J8_hwKSeffYConnect 🔗 : Twitter: twitter.com/MaxProgramming1 Facebook: facebook.com/Max-Programming-103081931147293 Github: github.com/max-programmingVS Code Theme used: 😎 Dark ModernSuggest, ask doubts in the comments and share these videos to help!Thanks for Watching!#nextjs #typescript #reactjs
Minecraft font for coding 😮 #shorts Max Programming 2023-05-04 | I found this cool looking font Minecraft inspired monospace font for codinggithub.com/IdreesInc/Monocraft#javascript #minecraft #coding
Reacts PropsWithChildren is a life saver! #shorts #reacts #typescript Max Programming 2023-05-03 | In this short I tell you about the PropsWithChildren type that comes with React which you can use to make your lives easier#javascript #reactjs #nextjs #typescript
Adding Todos - Build a Full CRUD Todo App with Tailwind CSS, JavaScript and Local Storage Max Programming 2023-04-08 | Hello, my friends and fellow developers!In this video, we cover how you can Build a Full CRUD Todo App with HTML, Tailwind CSS, JavaScript and Local Storage!Let me know in the comments below if you want more JavaScript content or something else.Check out these amazing tutorials by @BroCodez first JavaScript Classes in 4 minutes - youtu.be/ndzAGJin2ZEConstructors in Classes - youtu.be/DaUFyK8M4WYPlaylist Link: youtube.com/playlist?list=PL1t-4UVc0coSQgyjvayvTeyae9B8Wkrzo🔥 Timestamps Start 🔥00:00 - Intro01:27 - Getting DOM Elements04:06 - Form Submit Event05:48 - Using JavaScript Class for todos10:55 - Adding todo in the array15:55 - Set data in local storage18:51 - Get data from local storage22:08 - Clear the input22:48 - Outro🔥 Timestamps End 🔥Other Tutorials: ⚛️ React and Material UI Todo App: bit.ly/reactmattodo 🟨 Other JavaScript videos: bit.ly/jstutorials 📘 Visual Studio Code videos: bit.ly/vscodevids 🔋 Build a Battery App in JS: youtu.be/J8_hwKSeffYConnect 🔗 : Twitter: twitter.com/MaxProgramming1 Facebook: facebook.com/Max-Programming-103081931147293 Github: github.com/max-programmingVS Code Theme used: Default Dark++ (Experimental)Suggest, ask doubts in the comments and share these videos to help!Thanks for Watching!#javascript #tailwindcss #programming
Catch Errors Quickly with this VS Code Extension! #shorts #vscode #javascript Max Programming 2023-04-01 | ...
Building a Meme Builder (College Project) [LIVE Stream] Max Programming 2023-03-15 | We are building a Meme Builder with Static tech. Join in and enjoy!It's my college project...#javascript #html #css
Learn How to Use Local Storage in React With an Easy-to-Understand Example Max Programming 2023-03-06 | Hello, my friends and fellow developers!In this video, we cover how you can use local storage in your React app! Most importantly, we cover 2 ways to do so. The proper way to do it is the second way...Let me know in the comments below if you want more React.js content or something else.Links mentioned in the video: Local Storage in JavaScript: youtu.be/U693xrQKFy4 Boilerplate code: stackblitz.com/edit/vitejs-vite-tze47 GitHub Repo: github.com/max-programming/digital-tally-counter usehooks-ts site: usehooks-ts.com🔥 Timestamps Start 🔥0:00 - Intro & Demo1:28 - Local Storage in Devtools1:40 - Setting item in Local Storage2:28 - Catching and fixing the bug4:06 - Read date from Local Storage6:01 - Using a custom hook through a library8:25 - Outro🔥 Timestamps End 🔥Other Tutorials: ⚛️ React and Material UI Todo App: bit.ly/reactmattodo 🟨 Other JavaScript videos: bit.ly/jstutorials 📘 Visual Studio Code videos: bit.ly/vscodevids 🔋 Build a Battery App in JS: youtu.be/J8_hwKSeffYConnect 🔗 : Twitter: twitter.com/MaxProgramming1 Facebook: facebook.com/Max-Programming-103081931147293 GitHub: github.com/max-programmingVS Code Theme used: ⚛️ Atom One DarkSuggest, ask doubts in the comments and share these videos to help!Thanks for Watching!#reactjs #javascript #coding #programming
The Coolest VS Code Cursor Effect You Dont Want to Miss! Max Programming 2023-03-02 | Hello, my friends and fellow developers!In this video, we cover how you can one of the coolest tricks in VS Code to animate and make your cursor look better!Let me know in the comments below if you want more VS Code content or something else.Links in the video: Reddit Post: reddit.com/r/vscode/comments/11e66xh/i_made_neovide_alike_cursor_effect_on_vscodeOther Tutorials: ⚛️ React and Material UI Todo App: bit.ly/reactmattodo 🟨 Other JavaScript videos: bit.ly/jstutorials 📘 Visual Studio Code videos: bit.ly/vscodevids 🔋 Build a Battery App in JS: youtu.be/J8_hwKSeffYConnect 🔗 : Twitter: twitter.com/MaxProgramming1 Facebook: facebook.com/Max-Programming-103081931147293 Github: github.com/max-programmingVS Code Theme used: 🦉 Night OwlSuggest, ask doubts in the comments and share these videos to help!Thanks for Watching!#vscode #javascript #coding
Home Page Build - Build a Full CRUD Todo App with Tailwind CSS, JavaScript and Local Storage Max Programming 2023-02-25 | Hello, my friends and fellow developers!In this video, we cover how you can Build a Full CRUD Todo App with HTML, Tailwind CSS, JavaScript and Local Storage!Let me know in the comments below if you want more JavaScript content or something else.Playlist Link: youtube.com/playlist?list=PL1t-4UVc0coSQgyjvayvTeyae9B8Wkrzo🔥 Timestamps Start 🔥00:00 - Introduction00:39 - Code Recap00:54 - Body & Container with Tailwind02:11 - Form Styling with Tailwind07:55 - Fixing a silly bug 😜08:41 - NO TODOS Part09:29 - Adding the animation & styling the div13:22 - Empty Div for TODOS14:02 - Conclusion🔥 Timestamps End 🔥Links mentioned in the video: NodeJS: nodejs.org Tailwind CSS: tailwindcss.com Local Storage Tutorial: youtu.be/U693xrQKFy4Other Tutorials: ⚛️ React and Material UI Todo App: bit.ly/reactmattodo 🟨 Other JavaScript videos: bit.ly/jstutorials 📘 Visual Studio Code videos: bit.ly/vscodevids 🔋 Build a Battery App in JS: youtu.be/J8_hwKSeffYConnect 🔗 : Twitter: twitter.com/MaxProgramming1 Facebook: facebook.com/Max-Programming-103081931147293 Github: github.com/max-programmingVS Code Theme used: 🧔 Bearded ThemeSuggest, ask doubts in the comments and share these videos to help!Thanks for Watching!#javascript #tailwindcss #programming
Building the Colornote app | Next.js 13, Xata, Tailwind CSS [LIVE Stream] Max Programming 2023-02-25 | We are building a Colornote app clone with NextJS and Xata. Join in and enjoy!
Working on the Colornote app | Next.js 13, Xata, Tailwind CSS [LIVE Stream] Max Programming 2023-02-16 | We are building a Colornote app clone with NextJS and Xata. Join in and enjoy!
Exploring Next.js 13 with App Directory [LIVE Stream] Max Programming 2023-02-11 | Streaming Live for the first time and building an app live on YouTube
The WORST JavaScript feature you didnt know about! #shorts Max Programming 2023-02-10 | #javascript #webdev #webdevelopment #coding #programming #education
Dont miss this chance to build a Full CRUD App! #shorts Max Programming 2023-02-05 | #javascript #coding #programming
Demo & Setup - Build a Full CRUD Todo App with Tailwind CSS, JavaScript and Local Storage Max Programming 2023-02-05 | Hello, my friends and fellow developers!In this video, we cover how you can Build a Full CRUD Todo App with HTML, Tailwind CSS, JavaScript and Local Storage!Let me know in the comments below if you want more JavaScript content or something else.Playlist Link: youtube.com/playlist?list=PL1t-4UVc0coSQgyjvayvTeyae9B8Wkrzo🔥 Timestamps Start 🔥0:00 - Introduction0:43 - Demo of the app2:05 - Prerequisites2:33 - Setup Vite App4:22 - Tailwind Setup6:23 - Starting Dev Server7:01 - Flowbite Setup7:53 - Conclusion🔥 Timestamps End 🔥Links mentioned in the video: NodeJS: nodejs.org Tailwind CSS: tailwindcss.com Local Storage Tutorial: youtu.be/U693xrQKFy4Other Tutorials: ⚛️ React and Material UI Todo App: bit.ly/reactmattodo 🟨 Other JavaScript videos: bit.ly/jstutorials 📘 Visual Studio Code videos: bit.ly/vscodevids 🔋 Build a Battery App in JS: youtu.be/J8_hwKSeffYConnect 🔗 : Twitter: twitter.com/MaxProgramming1 Facebook: facebook.com/Max-Programming-103081931147293 Github: github.com/max-programmingVS Code Theme used: 🧔 Bearded ThemeSuggest, ask doubts in the comments and share these videos to help!Thanks for Watching!#javascript #tailwindcss #programming
What is e in JavaScript? #shorts Max Programming 2023-02-03 | #javascript #coding #webdevelopment #programming #math #chatgpt
Array Reverse is DANGEROUS in JavaScript! #shorts Max Programming 2023-02-02 | #javascript #arrayreverse #programming #coding #tech #software #softwaredevelopment #codelife #developer #programmer
ChatGPT FAILS to answer this EASY JavaScript question? #shorts #javascript #chatgpt Max Programming 2023-01-28 | I use ChatGPT in my daily life. This video is just for fun! Enjoy it. Don't take it personally 🙂#chatgpt #openai #javascript #reactjs #tailwindcss #coding #programming
ChatGPT FAILS to write a BASIC Password Generator with React and Tailwind CSS #shorts Max Programming 2023-01-26 | I use ChatGPT in my daily life. This video is just for fun and to show it cannot replace developers. Enjoy it. Don't take it personally 🙂#chatgpt #openai #javascript #reactjs #tailwindcss
Animations with HTML, CSS and LottieFiles - You Wont Believe How EASY it is! Max Programming 2023-01-26 | Hello, my friends and fellow developers!This video covers how you can easily and quickly add animations to your websites easily and quickly!Let me know in the comments below if you want more webdev content or something else.Links mentioned in the video: LottieFiles: lottiefiles.com The animation used: lottiefiles.com/9945-space-launch GitHub Code: github.com/max-programming/lottie-demo Advanced Lottie Docs: github.com/LottieFiles/lottie-player🔥 Timestamps Start 🔥00:00 - Introduction00:44 - How LottieFiles Work?01:38 - How to Find Animations?02:31 - Editing the Animation03:01 - How to use a LottieFile?03:32 - Setup and using with HTML06:25 - Customizing the Animation07:41 - The CSS Part09:08 - Conclusion🔥 Timestamps End 🔥Other Tutorials: ⚛️ React and Material UI Todo App: bit.ly/reactmattodo 🟨 Other JavaScript videos: bit.ly/jstutorials 📘 Visual Studio Code videos: bit.ly/vscodevids 🔋 Build a Battery App in JS: youtu.be/J8_hwKSeffYConnect 🔗 : Twitter: twitter.com/MaxProgramming1 Facebook: facebook.com/Max-Programming-103081931147293 Github: github.com/max-programmingVS Code Theme used: 🧔 Bearded ThemeSuggest, ask doubts in the comments and share these videos to help!Thanks for Watching!#html #animations #javascript
How to build a Contact Form in Node.js and Google Sheets? Max Programming 2023-01-09 | Hello, my friends and fellow developers!In this video, we cover how you can build a contact form that integrates with Google Sheets and all the details are stored in the sheet once the form is submitted! We will use Node.js, Express and Google Sheets API to make it work.Let me know in the comments below if you want more Node.js content or something else.This tutorial is heavily inspired by @Fireship. His video on using Google Sheets as a database helped me build this and many other cool projects.Links mentioned in the video: Google Dev Console - console.cloud.google.com/apis/dashboard GitHub Repo - github.com/max-programming/contact-form-sheets Fireship's video - youtu.be/K6Vcfm7TA5U🔥 Timestamps Start 🔥00:00 - Intro & Demo01:23 - Creating the project02:17 - Installing dependencies03:32 - package.json changes03:54 - Set up Google Sheets API07:08 - Download key file08:09 - Create and configure the sheet09:32 - Back-end coding starts16:17 - Set up sheet client in code22:15 - Appending test data to sheet26:49 - Adding user's info to sheet30:49 - Front-end coding starts36:24 - Outro🔥 Timestamps End 🔥Other Tutorials: ⚛️ React and Material UI Todo App: bit.ly/reactmattodo 🟨 Other JavaScript videos: bit.ly/jstutorials 📘 Visual Studio Code videos: bit.ly/vscodevids 🔋 Build a Battery App in JS: youtu.be/J8_hwKSeffYConnect 🔗 : Twitter: twitter.com/MaxProgramming1 Facebook: facebook.com/Max-Programming-103081931147293 GitHub: github.com/max-programmingVS Code Theme used: Default Dark+Font used: Cascadia CodeSuggest, ask doubts in the comments and share these videos to help!Thanks for Watching!#nodejs #javascript #programming
Webhooks Demystified - Get Real-Time Personal Notifications with Discord Webhooks Max Programming 2022-12-24 | Hello, my friends and fellow developers!In this video, we will learn about Webhooks and how you can use Discord's Webhooks for your personal notifications!Let me know in the comments below if you want more Discord content or something else.Links mentioned in the video: 1. usmans.me 2. blog.usmans.me/webhooks-101 3. hoppscotch.io 4. birdie0.github.io/discord-webhooks-guide 5. github.com/max-programming/usmans.me🔥 Timestamps Start 🔥00:00 Intro01:13 Overview 02:29 Creating the Webhook 03:54 Testing the Webhook 06:45 Adding the feature 07:42 How to do in Next.js? 09:26 Outro 🔥 Timestamps End 🔥Other Tutorials: ⚛️ React and Material UI Todo App: bit.ly/reactmattodo 🟨 Other JavaScript videos: bit.ly/jstutorials 📘 Visual Studio Code videos: bit.ly/vscodevids 🔋 Build a Battery App in JS: youtu.be/J8_hwKSeffYConnect 🔗 : Twitter: twitter.com/MaxProgramming1 Facebook: facebook.com/Max-Programming-103081931147293 GitHub: github.com/max-programmingVS Code Theme used: Default Dark+Suggest, ask doubts in the comments and share these videos to help!Thanks for Watching!#javascript #discord #webdevelopment
CHANGE THIS VS Code setting to see code more clearly #shorts Max Programming 2022-11-14 | #vscode #python #webdevelopment
6 JavaScript ways to loop over arrays #shorts Max Programming 2022-11-14 | #javascript #webdevelopment #shorts
Use this CSS trick to make your images stand out! #shorts Max Programming 2022-11-13 | #css #javascript #webdevelopment #webdesign
How to add gradient color on Text with CSS? #shorts Max Programming 2022-11-12 | Gradient King Website: https://dub.sh/gking#shorts #webdevelopment #css
If you truly hate RegEx, try this. #shorts Max Programming 2022-11-11 | #shorts #javascript #webdevelopment
Learn how to use TypeScript with Node and Express - updated for 2023 Max Programming 2022-11-11 | Hello, my friends and fellow developers!In this video, we cover how you can use TypeScript with your Node and Express app!Let me know in the comments below if you want more TypeScript content or something else.Links mentioned in the video: Template on GitHub: https://dub.sh/repo-exp-ts Set up steps: https://dub.sh/steps-exp-ts TS Node Dev: npmjs.com/package/ts-node-dev🔥 Timestamps Start 🔥00:00 Intro00:18 Initialize the app 02:40 Basic Express Server 03:49 Running the app in development 05:41 Compiling to JavaScript 07:40 Running in Production 08:25 Template on GitHub 08:49 Steps with commands 09:08 Outro 🔥 Timestamps End 🔥Other Tutorials: ⚛️ React and Material UI Todo App: bit.ly/reactmattodo 🟨 Other JavaScript videos: bit.ly/jstutorials 📘 Visual Studio Code videos: bit.ly/vscodevids 🔋 Build a Battery App in JS: youtu.be/J8_hwKSeffYConnect 🔗 : Twitter: twitter.com/MaxProgramming1 Facebook: facebook.com/Max-Programming-103081931147293 GitHub: github.com/max-programming🎥 Gear I use: 🎤 Mic: amzn.to/3DGqEH9 🎙️ Mic Holder: amzn.to/3NAnM2U 🎧 Headphones: amzn.to/3Wy7CuZ ⌨ Keyboard: amzn.to/3E2mSci 📷 Webcam: amzn.to/3Tb0IceVS Code Theme used: 🎭🌀 Ayu Mirage BorderedSuggest, ask doubts in the comments and share these videos to help!Thanks for Watching!#javascript #nodejs #typescript #webdevelopment
How to create a button with icon using HTML and CSS #shorts Max Programming 2022-11-09 | #shorts #html #css #javascript
Master Generics with TypeScript: A Easy-to-Understand Example Max Programming 2022-11-05 | Hello, my friends and fellow developers!In this video, we cover what are Generics in TypeScript and how you can use and understand them properly. I show an example that will be very easy to understand and won't complicate things!Let me know in the comments below if you want more TypeScript content or something else.Other Tutorials: ⚛️ React and Material UI Todo App: bit.ly/reactmattodo 🟨 Other JavaScript videos: bit.ly/jstutorials 📘 Visual Studio Code videos: bit.ly/vscodevids 🔋 Build a Battery App in JS: youtu.be/J8_hwKSeffYConnect 🔗 : Twitter: twitter.com/MaxProgramming1 Facebook: facebook.com/Max-Programming-103081931147293 GitHub: github.com/max-programming🎥 Gear I use: 🎤 Mic: amzn.to/3DGqEH9 🎙️ Mic Holder: amzn.to/3NAnM2U 🎧 Headphones: amzn.to/3Wy7CuZ ⌨ Keyboard: amzn.to/3E2mSci 📷 Webcam: amzn.to/3Tb0IceVS Code Theme used: Default Dark+Suggest, ask doubts in the comments and share these videos to help!Thanks for Watching!#typescript #javascript #webdevelopment
