Build a Real-Time Slack Clone With Nextjs, React, Tailwind, Auth.js | Part 1/2 (2024)

Поділитися
Вставка
  • Опубліковано 2 лис 2024

КОМЕНТАРІ • 323

  • @codewithantonio
    @codewithantonio  Місяць тому +27

    🔴CSS FIX (READ DURING 00:02:29 CHAPTER) 🔴
    add "./src/features/**/*.{js,ts,jsx,tsx,mdx}" to tailwind.config.ts:
    content: [
    ...
    "./src/features/**/*.{js,ts,jsx,tsx,mdx}",
    ],

  • @KimJune-x2s
    @KimJune-x2s 2 місяці тому +90

    The biggest reason I am grateful to Antonio is he actually starts step by step and START FROM SCRATCH and explaining each steps, I finished his 3 tutorials out of 20 his videos and understood everything he did and I actually learned a lot because of it. There are many other UA-camrs do very cool projects but the project keeps discouraging by keep telling me " Oh just copy this and paste it and don't worry about it" LOL and I have no idea what is going on, I believe the reason we are here because we are either new on this developing journey or we are stupid, that is why I really like the way Antonio teaches in his video and going to buy his subscription for premium course when I finish his free content first. Again thank you very much for your free content

    • @isamalk7744
      @isamalk7744 2 місяці тому

      Great comment. I would like to argue that you are not necessarily stupid for simply not being able to fire up your intuition and connect the dots of whatever thing that is being copy/pasted. The amount of nuance and possibilities of dependencies/utilities in and of themselves are huge, let alone when merging them with the code, but we are only interested in the functionality needed for this project.
      Not being thorough with the explanations makes you waste time by forcing you to jump out of the project towards another source of knowledge to try to piece it together, and it is not a given that you will successfully do this. Antonio is one hell of a blessing as a tutor because he understands the need for students to be in a compact, well built learning bubble, reducing immensely the friction caused by the unnecessary difficulty of leaving steps unexplained. To expect a student to go out of their way to reach something you could have given them is reckless at best and cruel at worst. It seems that in the software world, this is a very widespread way of letting knowledge "flow", as if this shit was some kind of egg hunt for the upcoming developers and not the pursue of a career. Once that a student is sufficiently prepared, a challenge here and there is not a bad thing, in fact, it is necessary to assess the progress of the student, but to compromise the main didactic source by being obtuse or uncaring about certain steps is plain and simply incompetent teaching.
      I read a quote a couple of hours ago that directly point out the importance of extremely well crafted tutorials like this one, it was something in the lines of "The path of accomplishment is not built by the quantity of time spent, but by the quality". It is only through dedicated and conscious effort that you will reach a worthy goal, but it is also true that you cannot do this alone, and you need a dedicated and conscious foundation to not shamble on your way to that goal, and Antonio has given us that.

  • @kiransilwal
    @kiransilwal 2 місяці тому +28

    Antonio, If my SaaS ever become successful, I will comeback for sure and donate to your cause so that you can continue helping the up and coming entrepreneurs out who are looking up to make this world a better place.

  • @codewithantonio
    @codewithantonio  2 місяці тому +115

    Hi all 👋 In this 15 hour tutorial split in two parts you will learn how to create an end-to-end fullstack and real-time slack clone, all with workspaces, channels, 1:1 conversations, threads, reactions, editing and deleting messages as well as member roles. By the end of this course you will gain knowledge on how to use cutting edge technologies to build your very own professional collaboration tool!

    • @braydenfulken2495
      @braydenfulken2495 2 місяці тому +5

      Keep it up bro. I'll keep sharing your channel to other developers to subscribe. Great work.

    • @johndoe-o4i
      @johndoe-o4i 2 місяці тому +2

      thank you :)

    • @talalanwer809
      @talalanwer809 2 місяці тому +2

      Can you please tell me what browser you're using in this tutorial??

    • @DoingCoding
      @DoingCoding 2 місяці тому

      @@talalanwer809 its arc browser

    • @gmd9767
      @gmd9767 2 місяці тому

      Is anyone else having a problem with convex auth on safari? It doesn’t redirect to the home page. Works fine on Chrome.

  • @SuperPompey77
    @SuperPompey77 Місяць тому +1

    Last message i sent was that Canvas was the best build I have ever seen. However I just finished the Slack tutorial and now I feel that that is the best project and tutorial that I have ever seen. The build went smoothly and you explained everything so well. This kind of teaching and explanations that you give are so valuable. I've never seen anyone explain it so well. Thankyou for all your effort in producing this and all the work that you do in explaining everything is so much detail. Its so much appreciated !!

  • @akintobiafeez4070
    @akintobiafeez4070 2 місяці тому +7

    Antonio, I can't thank you enough for your contributions to me as a frontend developer, I have learned a lot from your videos that I have applied to work. I am forever grateful

  • @catinzone
    @catinzone 2 місяці тому +4

    Great tutorial! I just completed around 1 hour of the video, and I'm thrilled with what I've learned so far 🎉. You've introduced me to best practices and new stacks like Bun and Convex, which I hadn't heard of before. It's just the beginning, and I'm excited to continue and explore everything else you have to share.
    I truly appreciate your hard work and passion. Your dedication to covering every detail without skipping anything is admirable. You've earned a spot on my top UA-camrs list, and I can confidently say you're a fantastic mentor. Thank you so much for your efforts! 🙏

  • @willzerawz581
    @willzerawz581 8 днів тому

    Friend, you are very good, I am passionate about your content and I watch all your videos, honestly you are the best channel related to programming that you currently have on UA-cam, your teaching is excellent, please don't stop I beg you haha

  • @joker-wr8pt
    @joker-wr8pt 2 місяці тому +32

    One day bro will create his own UA-cam 👀🐐

    • @iamdanajr
      @iamdanajr 2 місяці тому +7

      if he created his own canvas, slack, notion and llm clones, youtube is not an issue.

  • @浪心宅人
    @浪心宅人 2 місяці тому +5

    太厉害了主播,看过youtube没有见过这么好的视频👍👍👍

  • @ggr0go
    @ggr0go 2 місяці тому +5

    Hey Antonio, I just wanna say thank you so much for everything 🙏🏻

  • @shivammittal5119
    @shivammittal5119 2 місяці тому +6

    Bro you are helping thousands of freshers without spending any kind of 👍🙏👌💰😊

  • @Jakiajke21
    @Jakiajke21 2 місяці тому +7

    Antonio Is The Best One That Makes Turtorials In Full-satck Apps

  • @maliksuleman9474
    @maliksuleman9474 2 місяці тому +5

    Antonio you are a great instructor for developers. Love from Pakistan

  • @technoinfoworldwide2329
    @technoinfoworldwide2329 2 місяці тому +4

    wow.this is a begineer friendly tutorial.Thanks man ! It would be better if you had mention begineer to advanced in title so that it can reach directly to us.

  • @Sapiens-dev
    @Sapiens-dev 2 місяці тому +2

    Thank you very much, you're the best teacher! Your lessons on website development on UA-cam are clear and easy to understand. I've learned so much from your videos. Thanks again! 💖

  • @pratikgupta3046
    @pratikgupta3046 2 місяці тому +6

    Was about to finish my final leg of the super comprehensive financial platform🤣... and I see another banger! You rock, Antonio! God bless you!

  • @youneshenni5417
    @youneshenni5417 Місяць тому +1

    You are the GOAT of Next JS tutorials !!!

  • @SK_Covers
    @SK_Covers 2 місяці тому +1

    Bro is back with the banger 🎉
    Sharing is caring ❤❤❤❤
    Love your work 😻

  • @IvanGregorTabalno
    @IvanGregorTabalno 2 місяці тому +2

    What I like most about Sir Antonio is that he never gets tired of repeatedly explaining the step-by-step basics, like configuring things such as ShadCN or setting up a new Next.js project. Especially when it comes to setting up authentication, even though these tutorials are already in his previous videos, he still doesn't get tired of explaining them in his new videos. His tutorials are a huge help, especially for those who are new to his channel.

    • @miraclenerdkidchiki6249
      @miraclenerdkidchiki6249 Місяць тому

      right?..i just love that about him...he doesnt assume that you already know or have don those steps before even though he has used it countless times in past projects..the guy is a God-sent for fullstack Next js devs

    • @rntbuilds
      @rntbuilds 23 дні тому

      @@IvanGregorTabalno that's so important. Thanks for pointing it out

  • @gambomaster
    @gambomaster 2 місяці тому +2

    Legend is back with yet another amazing tutorial. 🙏🙏🙏

  • @MohammedMaaz-un2gp
    @MohammedMaaz-un2gp 2 місяці тому +1

    Been waiting a long time. Thank you for this!!

  • @SirEdges_Adejo
    @SirEdges_Adejo 2 місяці тому +1

    Another great tutorial that builds its own Auth with open source package unlike others who just advertise for 3rd party commercial companies packages and call it tutorials.
    Great tutorial as always 🎉

  • @smartbeeinc
    @smartbeeinc 2 місяці тому +1

    My Odogwu Antonio! you're just amazing. God bless you, man

  • @Metovski
    @Metovski 2 місяці тому +2

    You are king of the web dev instructors!

  • @DarkAcademyUniversity
    @DarkAcademyUniversity 2 місяці тому +1

    Damn bro, you almost have 350k subscribers. Congrats bro! When I subscribed to your channel, the numeber of your subscribers was 12-15k. Keep going ! Nice growth!

  • @KimJune-x2s
    @KimJune-x2s 2 місяці тому +40

    Holy shit I just finished your discord tutoral and then refresh I see this? and its currently 2am, I don't think I will sleep tonight

    • @padamsubba1973
      @padamsubba1973 2 місяці тому +9

      😅 baby calm down 😂😂

    • @KimJune-x2s
      @KimJune-x2s 2 місяці тому

      @@padamsubba1973 Hehe just started my journey with coding for 6 months, try to learn as much as I can from Antonia then put all things together to create my own project, all tutorials from Antonio is no joke not like useless shit I learned from my schools

    • @hameeeed5992
      @hameeeed5992 2 місяці тому

      @@KimJune-x2s why not try and build this on your own with the knowledge you got from the discord, they are almost same.

    • @shadowslayer2248
      @shadowslayer2248 2 місяці тому +3

      UA-cam's not gonna delete it and there's always tomorrow 😂

    • @JourneyGoesOn1
      @JourneyGoesOn1 2 місяці тому

      hey yo the Clone Is Worked The Discord Plese Tell me

  • @leomelegari
    @leomelegari 2 місяці тому +1

    Thanks man! This is insane! Excited for the part 2 already

  • @Deus-lo-Vuilt
    @Deus-lo-Vuilt Місяць тому

    Thank you Antonio, it is appreciated that you do everything step by step and can see the process.

  • @mohammadabbas1623
    @mohammadabbas1623 2 місяці тому +2

    My man is back ❤

  • @MatheusGrizaEstrazulas-f9g
    @MatheusGrizaEstrazulas-f9g 2 місяці тому +1

    Cheers from Brasil, Antonio! Your videos make me get up from the bed and start coding with u. Thanks for the amazing classes and the amazing channel you have!

  • @tmk2462
    @tmk2462 Місяць тому +1

    The GOAT, nothing else to say ! THANK YOU man ! Hi from Paris !!!!!!!!!!!!!!!

  • @hashblast3r
    @hashblast3r 2 місяці тому +1

    The GOAT drops another banger!

  • @3aw-3aw
    @3aw-3aw 2 місяці тому +1

    Awesome course! Thanks a lot for your efforts Antonio once again.

  • @SuperPompey77
    @SuperPompey77 2 місяці тому +1

    I am still going through the last build on your paid site. I have to tell you it is the best site I've ever joined and am learning so much. Once i finish that build I will start this one. I'm at the point in that build where you are explaining Hono which seems very good for API's

  • @S.AdithyaVardhan
    @S.AdithyaVardhan 2 місяці тому +1

    The wait is over 🔥

  • @0xOmzi
    @0xOmzi 2 місяці тому +1

    Thanks so much for this mini course sensei 🙏🏽❤️.
    Time to level up!

  • @andyloren4826
    @andyloren4826 14 днів тому

    This boy single-handedly builds an entire software.

  • @DeepakSankhyan
    @DeepakSankhyan 2 місяці тому +8

    The Antonio Magician developer pull another rabbit from the hat , Enjoy folks, bow down to you Antonio........

  • @hienluongvi3533
    @hienluongvi3533 2 місяці тому +2

    Super cool, thanks for the hard work ❤❤❤

  • @mkhanyisisimelane3477
    @mkhanyisisimelane3477 2 місяці тому +1

    Here we go! 🐐 is back

  • @shariqshaikh721
    @shariqshaikh721 2 місяці тому +1

    Amazing Tutorial. Easy to understand and clear step by step explanation

  • @Miguel_Castaneda
    @Miguel_Castaneda 2 місяці тому +1

    Let's go! Another great video!

  • @mehmetyalvac7338
    @mehmetyalvac7338 24 дні тому

    appreciate your effort! Really helps getting in the dev after some time :)

  • @iMarkyJD
    @iMarkyJD Місяць тому +1

    Yet another banger! Thank you Antonio, you da man! I would love to see you feature other frameworks in a video. Possibly Remix, Astro or Svelte?

    • @codewithantonio
      @codewithantonio  Місяць тому

      Thank you! I am eagerly waiting for Tanstack Start to become available. I am also eyeing Remix in the future

    • @miraclenerdkidchiki6249
      @miraclenerdkidchiki6249 Місяць тому

      @@codewithantonio Tanstack Start + Convex is going to be the tool to build my first SAAS 😁

  • @not_a_human_being
    @not_a_human_being 2 місяці тому +1

    Your vids are such a treat! :D

  • @patrickmullot73
    @patrickmullot73 2 місяці тому

    Antonio's tutorials are really high quality. I just miss a mention of the tech stack in the comments or at the beginning of the video.

  • @bigwillkilgallon
    @bigwillkilgallon 2 місяці тому +2

    14 seconds ago, get in. Always got time for you Antonio

  • @ADHDOCD
    @ADHDOCD 2 місяці тому

    Holy smoke! This man keeps dropping content one better than the other! Best UA-camr for coding! For your next idea, can you also build a CRM like Hubspot, GoHighLevel?
    PS: where's the donate/thanks button on your channel??

  • @datogogniashvili3304
    @datogogniashvili3304 2 місяці тому +1

    Duude u always drop bombs man

  • @brunoaalexandre
    @brunoaalexandre 2 місяці тому +2

    Amazing 🔥🔥🔥

  • @atulkadyan1303
    @atulkadyan1303 2 місяці тому +1

    amazingg once again. I always wait for your videos

  • @ahmedaq9018
    @ahmedaq9018 2 місяці тому

    amazing as always Antonio... please consider making a comprehensive tutorial on Supabase or using Supabase (like what you did with Convex)-- using the Supabase Auth and without using Primsa or Drizzle -- exactly as you do with Convex... just consider that please... would be really amazing to see Supabase in the Antonio way... really thanks a lot for everything you do and for the amazing, authentic tutorials.

  • @muhammadusmanali3718
    @muhammadusmanali3718 Місяць тому +1

    Great tutorial man

  • @kei4248
    @kei4248 2 місяці тому +1

    Thank you for adding timestamps!

  • @jovincebrillantes1042
    @jovincebrillantes1042 2 місяці тому +1

    Can't wait for your React 19 tutorials when React 19 is finally released.

  • @Fr4nz2K
    @Fr4nz2K Місяць тому +1

    Bro im here right now because my groupmate just said to the professor that we will create a application like Slack and he was ecstatic because most groups just decided to go with ecommerce app. Bro I thought I was cooked until I saw this 😂 So Antonio thank you.

  • @nomadmack
    @nomadmack 2 місяці тому +1

    Grande Antonio!! Grazie mille

  • @ruturajbhandari7695
    @ruturajbhandari7695 2 місяці тому

    I can really build the project right now but , Thanks for the super amazing mega project, By learing to do clones with you , I am able to grasp the key ideas or the key feature of the clone and i kind of get a mental model of it , which i can use in my own projects . Thanks again

  • @7rkat701
    @7rkat701 2 місяці тому +1

    This guy this guy !! what amazing content !!!!!!

  • @Iamvijaypotnuru
    @Iamvijaypotnuru 2 місяці тому +1

    Really awesome sir ❤

  • @wahidulislam-dl5cv
    @wahidulislam-dl5cv 2 місяці тому +1

    amazing videos thanks for making this tutorial videos really appreciating 💕

  • @hellforall8140
    @hellforall8140 23 дні тому

    Ok Antonia thanx for introducing me with Jotai initially i thought u will use zustand which i didn't like much so i integrated with redux toolkit...and now i am managing state with that... kindly use redux toolkit in upcoming projects ❤❤❤thanx for this

  • @Swizzy19891
    @Swizzy19891 2 місяці тому +1

    Great work!

  • @AmirShakeel-kt6jg
    @AmirShakeel-kt6jg 2 місяці тому +1

    You ARE THE GOAT

  • @galaxy792
    @galaxy792 27 днів тому +2

    how to thank you man, you are great.

  • @neonblaze1-c6x
    @neonblaze1-c6x 2 місяці тому +1

    Great project ❤

  • @prashlovessamosa
    @prashlovessamosa 2 місяці тому +1

    Thanks Antonio indeed very helpful

  • @jonedoe2163
    @jonedoe2163 2 місяці тому +1

    Thank you Antonio 🎉😊❤

  • @achrefnabil2463
    @achrefnabil2463 2 місяці тому +2

    Please please really we need mern stack projects especially back end part ❤

  • @user-xy5sm5nn3v
    @user-xy5sm5nn3v 2 місяці тому +1

    you are THE BEST

  • @samincgs
    @samincgs 2 місяці тому +2

    Just curious I don’t know if you mentioned in the video yet because I’m so early on, but is there a reason you switched to using the src directory instead of the app directory because in all your other projects you used the app directory. Thanks again for an amazing tutorial, always learning so much from you Antonio :)

    • @codewithantonio
      @codewithantonio  Місяць тому

      No any special reason really, i just feel it is more structured that way!

  • @MrArod1207
    @MrArod1207 2 місяці тому

    Another awesome tutorial. I am about to get started on it. Can you guys give me feedback on the best way to get through a long tutorial? Do yall watch all the way through, pause the video after a couple of minuets? Whats the best way to learn?

  • @alexawunor8853
    @alexawunor8853 Місяць тому

    How do you figure all this things out? 😅🤣
    You're the standard man. Keep up the good work. 👌👍

  • @MrPlaybook
    @MrPlaybook Місяць тому

    This guy rocks!
    True story

  • @AbdullahRajpoot117
    @AbdullahRajpoot117 2 місяці тому +2

    Grrreat!! 😎

  • @motlalepulasello8775
    @motlalepulasello8775 2 місяці тому

    Consider me blown away. Your dedication is admirable!
    And not to be ungrateful but can you teach us how to build a merchant of record or any payment processing solution that can mimic or rival platforms like Paddle and Lemonsqueezy? 🥺

  • @niltonschumacherfilho3368
    @niltonschumacherfilho3368 2 місяці тому

    Hey Antonio! Love you videos! Does paying on your website show extra content for all tutorials?

  • @kasyfizamzam
    @kasyfizamzam 2 місяці тому

    can't wait to see next tutorial using shadcn blocks and chart. maybe inventory management app?

  • @olowoniyidaniel
    @olowoniyidaniel 2 місяці тому

    anthonio wtf is this now... let's go build this... and thank you for this resource ... GOD bless you 🙃🙃

  • @mr.fabian8471
    @mr.fabian8471 2 місяці тому +1

    Thank you !!

  • @kamanipaul5972
    @kamanipaul5972 2 місяці тому +1

    Hehehe. Another Anthonio course. 🥳🥳🥳

  • @chema3659
    @chema3659 2 місяці тому

    Eres el mejor, muchas gracias por compartir todos tus conocimientos.

  • @9622AX
    @9622AX 2 місяці тому

    Thanks for the project.
    We need BTS of all ur projects. 😅

  • @gabrielchima6916
    @gabrielchima6916 2 місяці тому

    Wow, Antonio is not pregnant at all, Always delivery boom✨✨✨✨

  • @anhoangbinh9602
    @anhoangbinh9602 Місяць тому

    really really cool

  • @futshipcom
    @futshipcom 2 місяці тому

    Would you consider creating a tutorial video for React Native and Laravel?
    I haven't watched the tutorial yet, but I'm sure it's the best. 🎉

  • @dave3k
    @dave3k Місяць тому

    Holy crap, I just checked the courses on the main site and you actually build fully functional clones with cool features. The problem is I'm a complete beginner and only know HTML/CSS at the moment. Can you guys recommend some courses/resources that I can learn from that'll help me to get to the level where I can take Antonio's courses? Paid or free is fine, I know it's gonna be a few years but I'm pretty excited to learn because I have a few app idea's of my own that I'd love to be able to build myself.

    • @hellforall8140
      @hellforall8140 Місяць тому +1

      Learn js then react then some node back-end and then it will be fine to follow this tutorial

    • @dave3k
      @dave3k Місяць тому

      @@hellforall8140 thanks for the roadmap. Are there any courses you would recommend?

    • @hellforall8140
      @hellforall8140 21 день тому

      Everything on Hitesh chaudhary channel then come back here for next js project development..it will take over an year to grab those concepts​@@dave3k

  • @mahmoudtokura
    @mahmoudtokura 2 місяці тому

    Would you consider a beginner tutorial playlist in React and NextJS? It would be nice to get some solid foundation knowledge for some of us who are new to React and Next. Thanks

  • @ashwinshaji2561
    @ashwinshaji2561 2 місяці тому

    Hey antonio, great project as always🥳. Can I know what browser are you using?

  • @CarlosTello-m8h
    @CarlosTello-m8h 2 місяці тому

    The best!

  • @paulnjau5444
    @paulnjau5444 6 днів тому

    Great Great Job

  • @BliitzPint
    @BliitzPint 2 місяці тому

    We really have to speak about the different pronunciation of the words "modal" and "model" ;). Especially for someone in development it is important, as both exists but both are completely different things.
    modal = long "o" (with a u-sound, like in "low" or "boat"), soft "d"
    model = short "o", hard "d" (some say it with a long o, that's also correct, but here there's no u-sound)

    • @DoingCoding
      @DoingCoding 2 місяці тому

      not necessary lol. not everyone is native English speaker and have to give a shit about perfection

    • @BliitzPint
      @BliitzPint 2 місяці тому

      @@DoingCoding If you don't thrive for perfection, then you should avoid coding tbh... just saying. And I'm just saying this because there are also "data models". And "data models" and "modal windows" are something completely different. So when you pronounce them the same some learners here might get confused...

  • @cubeunicorn4055
    @cubeunicorn4055 2 місяці тому

    Thank you Antonio, just want to say please teach us how this types of projects run in production what tools are used to maintain this projects apps

  • @afaqahmad-ef4ky
    @afaqahmad-ef4ky 2 місяці тому +1

    Hey anthonio.
    You always make premium content for free.
    Thank you so much and I've a question please do respond.

  • @programacaocomramon
    @programacaocomramon 2 місяці тому +1

    The legend, the myth

  • @abdoulniallydaff
    @abdoulniallydaff 2 місяці тому +1

    Thanks you very much ❤❤

  • @fenixx0704
    @fenixx0704 Місяць тому

    Hello Antonio! Thank you for your great content ! One question to you , can you also use rutube for uploading your video , cause in some Russian regions UA-cam almost stopped working:

  • @dereksantossidi6850
    @dereksantossidi6850 Місяць тому +1

    Ate 5:54:31 he was like waking up, remember to exercise antonio and sleep well man :))).
    PS: thanks so much for the course im in the middle of the amazon jungle and it's thansk to you that im practicing and learning typescript.

    • @codewithantonio
      @codewithantonio  Місяць тому +1

      😅 while I usually do these late at night, that part of confusion was caused by my neighbor randomly drilling the wall, so i had to decide wether to continue talking, or pause the recording since i had no idea if the mic will pic it up. it does pic it up, so that chapter will be a bit weirdly split, but i think i mostly make it seem like a normal chapter 😅

    • @dereksantossidi6850
      @dereksantossidi6850 Місяць тому +1

      @@codewithantonio yeah you did haha thanks a lot for everything, have a blessed week mate.

  • @learnanywhere139
    @learnanywhere139 2 місяці тому

    hope next time you will release a toturial related to drag and drop to create interface (CMS)