As a Programmer
As a Programmer
  • 36
  • 1 550 236
MERN Stack Project: Realtime Chat App Tutorial - React.js & Socket.io
Build a Realtime Chat App with MERN Stack. Completely beginner friendly.
Code: github.com/burakorkmez/fullstack-chat-app (⭐️ Stars appreciated )
Discord for your questions: discord.gg/yEyKQWYugG
Highlights:
🌟 Tech stack: MERN + Socket.io + TailwindCSS + Daisy UI
🎃 Authentication && Authorization with JWT
👾 Real-time messaging with Socket.io
🚀 Online user status
👌 Global state management with Zustand
🐞 Error handling both on the server and on the client
⭐ At the end Deployment like a pro for FREE!
⏳ And much more!
Timestamps:
00:00:00 - Demo
00:01:44 - Backend Setup
00:13:46 - Database Setup
00:26:04 - Signup
00:47:38 - Login & Logout & Update Profile
01:12:52 - Message Routes
01:27:40 - Signup & Login Pages
02:16:09 - Profile Page
02:30:23 - Settings Page
02:41:29 - Home Page - Sidebar
02:58:06 - Home Page - Chat Container
03:29:26 - Understanding & Implementing Socket.io
04:15:09 - Detailed Deployment
04:29:22 - Final Tests & bye
มุมมอง: 12 445

วีดีโอ

Advanced Spotify Clone: Build & Deploy a MERN Stack Spotify Application with React.js
มุมมอง 18K14 วันที่ผ่านมา
Source Code: github.com/burakorkmez/realtime-spotify-clone (Stars appreciated ⭐) Try Clerk for FREE: go.clerk.com/CfzKAWC Discord: discord.gg/yEyKQWYugG Key Features: 🎸 Listen to music, play next and previous songs 🔈 Update the volume with a slider 🎧 Admin dashboard to create albums and songs 💬 Real-time Chat App integrated into Spotify 👨🏼‍💼 Online/Offline status 👀 See what other users are list...
Ultimate Stripe Tutorial for Beginners in 5 HOURS - Subscriptions, Payments, Emails
มุมมอง 7K28 วันที่ผ่านมา
Try Convex for Free: convex.dev/c/asaaprogrammer Try Clerk for Free: go.clerk.com/xrJNNpu Try Upstash for Free: upstash.com/? Source Code: github.com/burakorkmez/full-stripe-tutorial (Stars appreciated ⭐) Discord: discord.gg/yEyKQWYugG Diagrams: www.eraser.io About this course: ✨One time payments 🚀 Subscriptions (Monthly & Yearly) 💰 Billing Portal for Customers 🔒 Authentication & Webhooks ✉ Sen...
Build a Full Stack Tinder Clone - Node, Express, Tailwind - Full Tutorial 2024
มุมมอง 10Kหลายเดือนก่อน
Code: github.com/burakorkmez/tinder-clone (Stars appreciated🌟) Diagrams: www.eraser.io (Sponsored) Discord for your questions: discord.gg/yEyKQWYugG MERN Stack Crash Course: th-cam.com/video/Dukz-3mS3Us/w-d-xo.htmlsi=vLlb-WZ_NkwP6RuH Timestamps: 00:00:00 Demo App 00:01:12 Backend Setup 00:11:45 Database Setup 00:35:15 Signup, Login & Logout 00:48:40 User Routes & Controllers 00:59:54 Match Rout...
23 HOURS Free Coding Bootcamp - Build 4 Awesome Projects
มุมมอง 148Kหลายเดือนก่อน
Web Development Coding Bootcamp. Build Full-Stack Projects. Discord to ask questions: discord.gg/yEyKQWYugG Source Code (Give it a star 🌟): First Project: github.com/burakorkmez/mern-crash-course Twitter Clone: github.com/burakorkmez/twitter-clone Netflix Clone: github.com/burakorkmez/mern-netflix-clone E-Commerce Store: github.com/burakorkmez/mern-ecommerce Timestamps: 00:00:00 Introduction 00...
Python Chat App Tutorial for Beginners - Full Course 2024
มุมมอง 5K2 หลายเดือนก่อน
Code: github.com/burakorkmez/python-chat (Stars appreciated🌟) Diagrams: www.eraser.io (Sponsored) Discord for questions: discord.gg/yEyKQWYugG Timestamps: 00:00 Demo App 00:47 Backend 23:49 Frontend 46:00 Deployment and bye... Subscribe to support this work tytyty Keywords: Python, Python for Beginners, Python projects for resume, Python Chat app, How to build a chat app with python, Python tut...
Build a Linkedin Clone with React and Node.js | Full Stack Tutorial
มุมมอง 21K2 หลายเดือนก่อน
Try Mailtrap for free: l.rw.rw/as_a_programmer (Sponsored) Diagrams: www.eraser.io (Sponsored) Code: github.com/burakorkmez/linkedin-clone (Star it if you're cool 🌟) MERN Stack Crash Course: th-cam.com/video/Dukz-3mS3Us/w-d-xo.htmlsi=vLlb-WZ_NkwP6RuH Discord for your questions: discord.gg/yEyKQWYugG Highlights: 🚀 Project Setup 🗄️ MongoDB Integration 💳 Stripe Payment Setup 🔐 Authentication Syste...
Build an E-Commerce Store and Admin Dashboard - React.js, Stripe, Node.js, Redis
มุมมอง 55K2 หลายเดือนก่อน
Try Upstash for Free: upstash.com/? (Sponsored) Source Code: github.com/burakorkmez/mern-ecommerce (Stars appreciated 🌟) Draw Diagrams for Free: www.eraser.io (Sponsored) Discord for questions: discord.gg/yEyKQWYugG In this 8-hour course, we will build and deploy our own E-Commerce Store with millions of cool and advanced features. About this course: 🚀 Project Setup 🗄️ MongoDB & Redis Integrati...
Leetcode but for Redis... I built this open-source project
มุมมอง 2.8K3 หลายเดือนก่อน
Excited to share my very first open source project: Rush ✨ Rush: www.redisrush.com Code: github.com/burakorkmez/redis-rush (Star if you like 🌟) My links: Discord: discord.gg/YFn2WyheZV X: x.com/asaprogrammer_ Thanks for watching and would love to hear your thoughts 👇
Advanced MERN Auth Course: Email Verification, Password Recovery, and Welcome Emails
มุมมอง 135K3 หลายเดือนก่อน
Try Mailtrap For Free: l.rw.rw/as_a_programmer (Sponsored) Diagrams: www.eraser.io (Sponsored) Code: github.com/burakorkmez/mern-advanced-auth (Stars appreciated 🌟) Join our Discord for your questions: discord.gg/YFn2WyheZV About This Course: 🔧 Backend Setup 🗄️ Database Setup 🔐 Signup Endpoint 📧 Sending Verify Account Email 🔍 Verify Email Endpoint 📄 Building a Welcome Email Template 🚪 Logout En...
React Admin Dashboard - Full Course & Free Template
มุมมอง 24K3 หลายเดือนก่อน
Welcome to the React Admin Dashboard tutorial 👋 Code: github.com/burakorkmez/react-admin-dashboard (Stars appreciated 🌟) Discord to ask your questions: discord.gg/YFn2WyheZV More tutorials from this channel 👇 Netflix Clone: th-cam.com/video/gRroBZczKAU/w-d-xo.htmlsi=BVCqj89TvYzKdbZp Twitter Clone: th-cam.com/video/4GUVz2psWUg/w-d-xo.htmlsi=J_oiedEL_bvFNvPj Subscribe to support my work 💙 Timesta...
MERN Stack Tutorial For Beginners in 2024 - Deployment Included
มุมมอง 24K3 หลายเดือนก่อน
Code: github.com/burakorkmez/mern-crash-course (Stars Appreciated 🌟) Discord to ask your questions: discord.gg/YFn2WyheZV Diagrams: www.eraser.io (Sponsored) Timestamps: 00:00:00 App Showcase 00:02:33 Server Setup 00:09:45 MongoDB Setup 00:16:00 SQL vs NoSQL 00:18:30 Creating a Product Model 00:22:30 Building Our API 00:55:50 Building the Frontend 01:59:54 Detailed Deployment and bye... React.j...
How To Build a Netflix Clone with MERN Stack in 2024 - Full Course
มุมมอง 52K4 หลายเดือนก่อน
Source Code: github.com/burakorkmez/mern-netflix-clone (Stars appreciated 🌟) Discord to ask your questions: discord.gg/YFn2WyheZV Diagrams: www.eraser.io (Sponsored) Assets: drive.google.com/drive/u/0/folders/18FzSOPrw40T4lzGimv7QazSznCx-H4Ds About This Course: ⚛️ Tech Stack: React.js, Node.js, Express.js, MongoDB, Tailwind 🔐 Authentication with JWT 📱 Responsive UI 🎬 Fetch Movies and Tv Show 🔎 ...
Build an Extremely Fast Chat App with Redis and React | Full Guide 2024
มุมมอง 13K4 หลายเดือนก่อน
Source Code: github.com/burakorkmez/redis-chat-app (Stars appreciated 🌟) Upstash: upstash.com/? Diagrams: www.eraser.io (Sponsored) Discord if you get stuck: discord.gg/YFn2WyheZV About This Course: - ⚛️ Tech Stack: Next.js 14, TypeScript, Tailwind CSS, Upstash Redis - 🔐 Authentication - 💬 Real-Time Messaging - 📱 Responsive UI - 🌗 Light and Dark Mode - 🔔 Notification Sounds - ⌨️ Satisfying Typi...
Stripe Subscriptions with Next.js - Full Course 2024
มุมมอง 13K4 หลายเดือนก่อน
Source Code: github.com/burakorkmez/stripe-subscriptions Kinde Auth: kinde.com/? Diagrams: www.eraser.io (Sponsored) Stripe CLI Setup: th-cam.com/video/LUHeCvVFATU/w-d-xo.html Discord to ask your questions: discord.gg/YFn2WyheZV Insights: - ⚛️ Tech Stack: Next.js 14, TypeScript, Prisma, MongoDB, Stripe - 🔐 Authentication with Kinde Auth - 💸 Monthly and Annually Subscriptions with Stripe - 💵 Bui...
Build an OnlyFans with Next.js, Stripe and React | Complete Guide 2024
มุมมอง 22K5 หลายเดือนก่อน
Build an OnlyFans with Next.js, Stripe and React | Complete Guide 2024
Build a Recipe Finder App with React and Tailwind | React.js for Beginners
มุมมอง 10K5 หลายเดือนก่อน
Build a Recipe Finder App with React and Tailwind | React.js for Beginners
PERN Stack Project: Build a Chat App From Scratch | Postgres, TypeScript, Prisma, React
มุมมอง 19K5 หลายเดือนก่อน
PERN Stack Project: Build a Chat App From Scratch | Postgres, TypeScript, Prisma, React
These shortcuts will change how you write code forever
มุมมอง 3.6K6 หลายเดือนก่อน
These shortcuts will change how you write code forever
JavaScript and Python - Build and Deploy a Full Stack Web App
มุมมอง 35K6 หลายเดือนก่อน
JavaScript and Python - Build and Deploy a Full Stack Web App
Let's Go! React with Go Complete Full Stack App - TypeScript, React Query // Go for Node Developers
มุมมอง 9K6 หลายเดือนก่อน
Let's Go! React with Go Complete Full Stack App - TypeScript, React Query // Go for Node Developers
MERN Stack Twitter: Build and Deploy a Full Stack Twitter Clone with React, Node.js and MongoDB
มุมมอง 96K6 หลายเดือนก่อน
MERN Stack Twitter: Build and Deploy a Full Stack Twitter Clone with React, Node.js and MongoDB
Build and Deploy a Full Stack WhatsApp Clone | Video Calls, Screen Sharing | React.js, TypeScript
มุมมอง 43K7 หลายเดือนก่อน
Build and Deploy a Full Stack WhatsApp Clone | Video Calls, Screen Sharing | React.js, TypeScript
12+ Hour MERN Masterclass: Build and Deploy a Threads App with Real-Time Chat Functionality
มุมมอง 109K8 หลายเดือนก่อน
12 Hour MERN Masterclass: Build and Deploy a Threads App with Real-Time Chat Functionality
GraphQL Crash Course in 2024 | Build a Full Stack MERN App
มุมมอง 44K8 หลายเดือนก่อน
GraphQL Crash Course in 2024 | Build a Full Stack MERN App
MERN Stack Project: Build and Deploy a Github-like App | React.js, MongoDB, Node.js, Passport.js
มุมมอง 37K9 หลายเดือนก่อน
MERN Stack Project: Build and Deploy a Github-like App | React.js, MongoDB, Node.js, Passport.js
Build and Deploy a Complete Chat App with MERN Stack | JWT, Socket.io, MongoDB | Beginner Friendly
มุมมอง 458K9 หลายเดือนก่อน
Build and Deploy a Complete Chat App with MERN Stack | JWT, Socket.io, MongoDB | Beginner Friendly
My plans for 2024 and channel goals...
มุมมอง 62610 หลายเดือนก่อน
My plans for 2024 and channel goals...
Publishing your own npm package feels like magic
มุมมอง 96011 หลายเดือนก่อน
Publishing your own npm package feels like magic
How to make Flappy Bird game in JavaScript - Step by step tutorial
มุมมอง 2.8K11 หลายเดือนก่อน
How to make Flappy Bird game in JavaScript - Step by step tutorial

ความคิดเห็น

  • @shreerammutukundu3149
    @shreerammutukundu3149 33 นาทีที่ผ่านมา

    Loved your videos bro, Could you start nextjs based projects

  • @tahaatik3552
    @tahaatik3552 48 นาทีที่ผ่านมา

    User validation failed: fullName: Path `fullName` is required., username: Path `username` is required., password: Path `password` is required., gender: Path `gender` is required. i am getting this error in signup endpoint how to solve this please any one can tell?

  • @BrandonTraviss
    @BrandonTraviss 2 ชั่วโมงที่ผ่านมา

    1:23:22 res.status(500).json({ error: "Internal Server Error" }); should be res.status(500).json({ message: "Internal Server Error" }); or every other res.status(500).json({ message: "Internal Server Error" }); should be res.status(500).json({ error: "Internal Server Error" }); Just to be consistent. Since we have not touched the frontend yet in the video I do not know which so I am just going with message and will change all to error later if need be to make clientside errors easier to display by checking if error exists in the response object

  • @AllInOne-vz3cm
    @AllInOne-vz3cm 2 ชั่วโมงที่ผ่านมา

    Very Informative video Sir, How to Implement the Emoji Picker in text area and set the lock concept for privacy Please guide Sir

  • @_sujit004
    @_sujit004 4 ชั่วโมงที่ผ่านมา

    Thank you, i build my another project by following you 💞

  • @growuptips
    @growuptips 4 ชั่วโมงที่ผ่านมา

    how i make new users and it also get all the conversations in sidebar there should be some like friend request or something like i think u re newbie

  • @CRCE__Hardik_Prajapati
    @CRCE__Hardik_Prajapati 5 ชั่วโมงที่ผ่านมา

    Can you please share the Diagram you made at 30:01 it would be too helpfull to make notes for me.

  • @dakiworld
    @dakiworld 9 ชั่วโมงที่ผ่านมา

    48:38

  • @alia.t.6120
    @alia.t.6120 10 ชั่วโมงที่ผ่านมา

    Hi I tried to work with this code but I couldn't quite get why you were using "POST" when it said router.get on Postman in the signup section. I set it to get on Insomnia and was getting an error about an undefined cookie.

  • @AnshikaSingh-sb2tc
    @AnshikaSingh-sb2tc 10 ชั่วโมงที่ผ่านมา

    Can someone help i am getting user not found when I am trying to send request even I am using correct id of user please help i have checked all codes but still getting same error

  • @rk3282
    @rk3282 11 ชั่วโมงที่ผ่านมา

    Does anyone knows this vs code theme name

  • @vishaljbind
    @vishaljbind 14 ชั่วโมงที่ผ่านมา

    there is a issue in Home Page(assets are not visible ) after cloning repository and setting .env

  • @panzagamesplay902
    @panzagamesplay902 17 ชั่วโมงที่ผ่านมา

    One of the best channel for MERNSTACK,I have learn alot from your tutorials, Please can you do video on Blog apps,where there is admin dashboard

  • @hassannouri9796
    @hassannouri9796 19 ชั่วโมงที่ผ่านมา

    ❤❤❤

  • @chintanmakwana9262
    @chintanmakwana9262 23 ชั่วโมงที่ผ่านมา

    you are just genius.....out of words ......great work

  • @AkashSahi-t8o
    @AkashSahi-t8o วันที่ผ่านมา

    hello bruh my mongodb is not logging please help me

  • @NonVegBanda
    @NonVegBanda วันที่ผ่านมา

    thanks man

  • @hardikpateriya2692
    @hardikpateriya2692 วันที่ผ่านมา

    you gained a sub, hats off

  • @Stanislav-d5j
    @Stanislav-d5j วันที่ผ่านมา

    it gave me a lot of knowledge,Thanks Bro!

  • @charlesyjp9477
    @charlesyjp9477 วันที่ผ่านมา

    This helps me a lot. Thanks.

    • @charlesyjp9477
      @charlesyjp9477 วันที่ผ่านมา

      Yet I have a small question: would using event "customer.subscription.created" make more sense and is a better practice than "checkout.session.completed"?

  • @DellG15-e3h
    @DellG15-e3h วันที่ผ่านมา

    It is the first project that made me compelled to build it since i saw it.Thanx for such a valuable content and appreciating u a lot❤!!

  • @ElectricMilesLLC
    @ElectricMilesLLC วันที่ผ่านมา

    I recieve this error when running vite in the browser the first time it causes my app to crash with the following error code, something with my file paths vite does not recognize. new error, "Failed to resolve import "next-themes" from "src/components/ui/color-mode.jsx." Does thsi files exist?" Anyone get past this part?

  • @avijitmalik5290
    @avijitmalik5290 วันที่ผ่านมา

    Thanks❤

  • @wannainvest971
    @wannainvest971 2 วันที่ผ่านมา

    Bro pls add typescript in every project we also learn typescript...😢

  • @tempiltin
    @tempiltin 2 วันที่ผ่านมา

    There was an error sending the confirmation email: Error: Not allowed. I'm getting an error called and I can't fix it.

  • @anhkhoa6720
    @anhkhoa6720 2 วันที่ผ่านมา

    what icon themes?

  • @workinehyaikob
    @workinehyaikob 2 วันที่ผ่านมา

    please give me interoffice communication projects of university using MERN

  • @dereje0926thomas
    @dereje0926thomas 2 วันที่ผ่านมา

    pleas give me interoffice commutation in university project

  • @Lukaa2335
    @Lukaa2335 2 วันที่ผ่านมา

    thanks

  • @dogzrgood
    @dogzrgood 2 วันที่ผ่านมา

    you never declared authRoutes function 8:27. so how come you are able to import it?

  • @motunmarteen
    @motunmarteen 2 วันที่ผ่านมา

    This is a very beautiful video... Thank you so much for sharing your knowledge

  • @itschris9094
    @itschris9094 2 วันที่ผ่านมา

    what theme do you use i like that btw

  • @subashvj1401
    @subashvj1401 2 วันที่ผ่านมา

    Bro post one react tailwind and framer motion animated website please bro

  • @pasindu1926
    @pasindu1926 2 วันที่ผ่านมา

    Please upload MERN + TYPESCRIPT project 🙏🙏🙏

  • @bhavishyatomer2606
    @bhavishyatomer2606 2 วันที่ผ่านมา

    clerk id means?

  • @SachinSachinsahu-qk2fp
    @SachinSachinsahu-qk2fp 2 วันที่ผ่านมา

    I have encountered this issue, anyone please help me chunk-BCXODTBQ.js?v=6da27714:19411 Uncaught TypeError: Cannot read properties of undefined (reading '_config') at ChakraProvider (@chakra-ui_react.js?v=6da27714:3274:10) at renderWithHooks (chunk-BCXODTBQ.js?v=6da27714:11546:26) at mountIndeterminateComponent (chunk-BCXODTBQ.js?v=6da27714:14924:21) at beginWork (chunk-BCXODTBQ.js?v=6da27714:15912:22) at beginWork$1 (chunk-BCXODTBQ.js?v=6da27714:19751:22) at performUnitOfWork (chunk-BCXODTBQ.js?v=6da27714:19196:20) at workLoopSync (chunk-BCXODTBQ.js?v=6da27714:19135:13) at renderRootSync (chunk-BCXODTBQ.js?v=6da27714:19114:15) at recoverFromConcurrentError (chunk-BCXODTBQ.js?v=6da27714:18734:28) at performConcurrentWorkOnRoot (chunk-BCXODTBQ.js?v=6da27714:18682:30)

  • @sarfarazkohda
    @sarfarazkohda 2 วันที่ผ่านมา

    great to watch these kind of videos free ❤😍

  • @divyanshkrishnatreya4594
    @divyanshkrishnatreya4594 2 วันที่ผ่านมา

    hey brother thanks a ton for the project tutorial but as i am signing up as a user its showing nothing after clicking the signup button. do you have any diagnostics for that??

  • @fastsainyt
    @fastsainyt 2 วันที่ผ่านมา

    Could you make PERN tutorial?

  • @Pratiyank
    @Pratiyank 2 วันที่ผ่านมา

    Bro i have created this one myself just on thing is missing that is sending media i will try to implement that also in future

  • @subashvj1401
    @subashvj1401 2 วันที่ผ่านมา

    The movie db is not working 😢😢 suggest me some other please

  • @swarnabhamajumder9561
    @swarnabhamajumder9561 2 วันที่ผ่านมา

    Superb project sir, I have been follwoing this channel for a while now and I have learned a lot form you. Can expect some nextjs project next or mern project but in full typescript, it would be great to learn all of it from you. Thank you again for this amazing project learned a lot.

  • @grandparick3176
    @grandparick3176 2 วันที่ผ่านมา

    This seems amazing but can someone kindly tell me can It really be followed and done from start to end? There are couple of videos on youtube where you kind of have to leave in mid point because either it doesn't work or it has some error in the middle while following or do I have to pay for any service from some website?. If I can follow and complete it then I would like to start from beginning to end.

  • @miguelmendez3236
    @miguelmendez3236 2 วันที่ผ่านมา

    Do you not want an async fullfillment done with a queue? If you have a bunch of subscriptions that renew at the beginning of the month, wouldn't you be slow to return a response to Stripe?

  • @dakiworld
    @dakiworld 2 วันที่ผ่านมา

    2:24:50 Check point // Keep going

  • @BLINKBOXHD
    @BLINKBOXHD 2 วันที่ผ่านมา

    Hello, another great tutorial as always! Could you do more beginner projects? You explain new concepts way better than most courses I have paid for

  • @OleksandrSemko
    @OleksandrSemko 2 วันที่ผ่านมา

    Очень крутой проект. Можно получить много опита

  • @mohammadabbas1623
    @mohammadabbas1623 2 วันที่ผ่านมา

    great job

  • @Glorian692
    @Glorian692 2 วันที่ผ่านมา

    Bro the thing i will never regret in my life is subscribing to your channel. You are really a mentor.

    • @asaprogrammer_
      @asaprogrammer_ 2 วันที่ผ่านมา

      Appreciate it!

    • @peterchinoko4339
      @peterchinoko4339 วันที่ผ่านมา

      ​@@asaprogrammer_ bro can you teach us docker also

  • @hamudxd9497
    @hamudxd9497 2 วันที่ผ่านมา

    KEEP IT UP ❤