Тёмный

Let's build a DISCORD clone with React Native 🔴 

notJust․dev
Подписаться 109 тыс.
Просмотров 152 тыс.
50% 1

Let's challenge ourselves and build a fully-fledged Discord clone with React Native and Stream Chat SDK
➡️ Open your Free Stream Maker Account: bit.ly/3hgaJ7B
🎒 Download the Asset Bundle (Images, Dummy data, PDF presentation, cookies):
assets.notjust.dev/discord
💻 Source code: github.com/notJust-dev/Discord
In this video, we will learn how to build a fully-fledged real-time chat messaging application similar to Discord or Slack. The application will have all of the engaging features you would want for in-app chat - such as emojis, likes, URL previews, and more.
Building in-app messaging functionality from scratch can take months - and that’s just for a bare-bones chat that contains none of the features that savvy app users expect. With the Stream Chat API, you can replicate polished social media messaging experiences found in popular applications such as Discord, Slack, WhatsApp.
By the end of this video, you will build a chat app with the next features:
✨1-on-1 Real-time messaging
✨Group channel messaging
✨Emojis, Reactions, GIFs
✨Image, Video and Attachment messages
✨URL previews
✨and more
🤯 All of this in one single video 🤯
📚 Enroll NOW in The Full-Stack Mobile Developer course and don’t miss out on your chance to become a 6-figure dev! Check out what our successful students are saying about their experience:
academy.notjust.dev/?...
💬 Join the notJust Development gang and let's build together:
Twitter: / vadimnotjustdev
Instagram: / vadimnotjustdev
Facebook: / notjustdev
LinkedIn: / vadimsavin
Discord: / discord
Timecodes:
0:00 Intro
2:48 Prerequisite
5:08 Setting up the project
14:44 Create Steam account & install stream chat SDK
23:06 Initialize a Stream client
26:08 Connect a user
37:36 Create a channel
43:31 Configuring UI components - overlay provider
47:21 Configuring UI components - chat
52:41 Configuring UI components - chat list
59:48 Configuring UI components - channel
1:08:43 Configuring UI components - message list
1:09:30 Configuring UI components - Message input
1:17:50 Summary
1:30:07 Basic authentication
1:44:15 Create auth context
2:05:06 Display channel list with drawer navigator
2:19:15 Create a channel screen
2:26:46 Render the messages for a channel
2:49:06 Theming
3:01:53 Fixing users channel list
3:04:58 Allow user join a channel
3:20:14 App test
3:24:54 Q&A
Disclaimer: This build is for educational purposes only!! All views, opinions, technology choices expressed in this video are my own and do not represent the views, opinions, technology choices of any entity whatsoever with which I have been, am now, or will be affiliated.
#VadimSavin #notjustdev #reactnative

Опубликовано:

 

5 май 2024

Поделиться:

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист
Посмотреть позже
Комментарии : 39   
@notjustdev
@notjustdev Год назад
📚 Enroll NOW in The Full-Stack Mobile Developer course and don’t miss out on your chance to become a 6-figure dev in 2023! Check out what our successful students are saying about their experience: academy.notjust.dev
@kadumonte1ro
@kadumonte1ro 7 месяцев назад
íí
@kadumonte1ro
@kadumonte1ro 7 месяцев назад
íi8kíi888íí8inniiinn88i
@zb2747
@zb2747 2 года назад
I respect the grind man - you’re the only dev I see pushing out tutorials and good react native clones consistently
@notjustdev
@notjustdev 2 года назад
Glad you like them!
@alexleocampbell
@alexleocampbell 2 года назад
Please do a part 2, Vadim! Been looking forward to your Discord series so much 🥳
@ipadnf7934
@ipadnf7934 Год назад
You are really good man, I'll love to have you mentor me on my programming journey
@zainulabdinshaikh2758
@zainulabdinshaikh2758 Год назад
Thank you for the build Vadim.
@hassaantahir3861
@hassaantahir3861 2 года назад
That was awesome and very knowledgeable ..
@_rushii
@_rushii 2 года назад
Discord is actually moving to React Native very soon, it's been in development for months by now
@ehodges2004
@ehodges2004 2 года назад
Looks really cool! Will you do E2E encryption in this project?
@jyotindratavanoji9929
@jyotindratavanoji9929 2 года назад
We definitely want a part 2 .. same as how you created Signal Clone 6 parts
@jyotindratavanoji9929
@jyotindratavanoji9929 2 года назад
@@shivamjha.56 yes
@mickyman753
@mickyman753 Год назад
Is this discord clone completed , there's a part 2 too, I'm a beginner so wanted to know that should I follow these 2 videos in order to make a fully functional discord clone, so can you help and share is it completed?
@mohammadsangare972
@mohammadsangare972 Год назад
I do love your VS-Code and CMD theme setup looks awesome, how can I get it? Awesome videos as always. Thanks for teaching us
@shivas2611
@shivas2611 2 года назад
discord clone is excellent.please continue with discord clone with more features like amplify backend authentication in the coming weeks thanks
@notjustdev
@notjustdev 2 года назад
We will do it today
@capossito
@capossito 2 года назад
Can you do a tutorial on AWS personalize and how to integrate well with Amplify?
@kugathajkangeswaran3876
@kugathajkangeswaran3876 2 года назад
Please do part 2. Please
@GlitchToGaming
@GlitchToGaming 2 года назад
Does this have screen sharing? I haven't seen any videos on RU-vid that teach how to do screen sharing with react native
@christinec6533
@christinec6533 10 месяцев назад
Thanks so much for the vid, but the tabs template for expo has changed so much its basically unrecognizable. How do i get access to this old template?
@antoniovuono4521
@antoniovuono4521 8 месяцев назад
Same issue here .... For this reason, I don't like this pre-configured templates !
@gamedestroyerak4308
@gamedestroyerak4308 Год назад
hey do it have seo? plz reply?
@IAMJRAD
@IAMJRAD Год назад
How could we do this but with discord mirrored chats from discord channels?
@LeafNugget
@LeafNugget Год назад
can you do this on windows?
@magacaygamaxamuud7253
@magacaygamaxamuud7253 2 года назад
Thanks moreeeeee...
@priyadarshnisundararajan5774
@priyadarshnisundararajan5774 2 года назад
can i build this using react cli?
@ranjithpal1
@ranjithpal1 2 года назад
can you clone a fitness app?
@zedrobot5864
@zedrobot5864 Год назад
Does stream chat have a free account?
@jorgecruz9383
@jorgecruz9383 Год назад
Is it me or does not work on Android?
@jorgecruz9383
@jorgecruz9383 Год назад
I personnally had to wrap OverlayProvider like this: ...
@louisrumunu8660
@louisrumunu8660 Год назад
@@jorgecruz9383 Thanks a lot, this issue disturbed me for a while😅
@hailai1053
@hailai1053 Год назад
me too , thanks alot
@michael-shakaikhanoba9810
@michael-shakaikhanoba9810 2 года назад
Please can you clone a banking application with a real bank type api please I need this but no body teaching
@michael-shakaikhanoba9810
@michael-shakaikhanoba9810 2 года назад
Please Vadim and if you don’t want that please try a manga reader app like takeyomi or manga bird please Vadim I need the manga reader app this has been my dream I just don’t know how I can assist for you to do this please with graphql cause a lot of people are looking for this but no one is doing it please reply if you can consider it because all these apps have been corporate work let’s try something very fun 😭😭😭😭😭
@michael-shakaikhanoba9810
@michael-shakaikhanoba9810 2 года назад
Just know this from NIGERIA I recommend you to a lot of people that want to take react native class
@beingofexistence13
@beingofexistence13 Год назад
Hj
@parthkolgiri7501
@parthkolgiri7501 Год назад
I like the content but can you stop making munching and spit noises😅
@usmanmarkaz
@usmanmarkaz Год назад
are you complete this Project
Далее
Someone Made an Ultra-Realistic Discord Clone
4:27
Просмотров 21 тыс.
Unboxing Expo SDK 50 and Expo Router V3
2:53:45
Просмотров 9 тыс.
Realtime Chat App in React Native and AWS (Backend) 🔴
3:29:01