Playback starts YouTube’s embedded player (privacy-enhanced mode).
Build a Realtime Chat App in React Native (tutorial for begginers) ????
ChannelVadim SavinChapters
Description from the creator
Check out the NEW updated version of this build:
youtube.com/live/mxXJSVW4tRY
Let's build a Realtime Chat mobile application in React Native based on the Whatsapp UI design.
✨ Asset Bundle: assets.notjust.dev/whatsapp
⌨️ Source code: github.com/Savinvadim1312/WhatsappClone
⚛️ React Native Mastery is the ONLY course you need to Master mobile development with React Native & Expo 🚀
Enroll here: notjust.dev/react-native-mastery
If you are a beginner that wants to learn javascript and react native, or and advanced javascript developer that wants to get into mobile development using react native then this Livestream is for you. This is a perfect opportunity to follow along and build this application together with us, and add it to your portfolio as it will help you land your next job. If you finish the app, tag me on social media and I will give you feedback.
We will start building the Whatsapp clone from scratch, starting from setting up a React Native project using Expo and finishing with connecting the application with a GraphQL backend using AWS Amplify. We will walk through designing the UI layout of the app, structuring everything in components, and putting everything together. We will also implement navigation between screens, header bars, and tab bars for the Whatsapp menu.
For the backend, we will be using AWS Amplify, which is an amazing combination of tools and services from AWS, that helps us build mobile and web applications faster. It offers pre-made authentication components and flows, database, API (REST and GraphQL), storage, and much more. We will be using Graphql subscriptions for the realtime chat functionalities
Doing the Whatsapp clone yourself is a great opportunity to practice React Native, modern Javascript, Typescript, AWS Amplify. We are always trying to use the latest technologies and best practices, so that's another opportunity to learn something new, being it functional components, hooks, state, navigations or AWS and Amplify.
💬 Join the notJust Development gang and let's build together:
Twitter: twitter.com/VadimNotJustDev
Instagram: instagram.com/VadimNotJustDev
Facebook: facebook.com/notjustdev
LinkedIn: linkedin.com/in/vadimsavin
Discord: discord.gg/VpURUN2
Timecodes
0:00 Intro
9:47 Initialize the React Native project
15:22 Project structure
16:35 React Navigation
50:57 Chat List Item Component
1:31:05 Chat Rooms List (FlatList)
1:48:34 Chat Screen
2:51:17 Chat Input Component
3:23:16 Floating Button (New Chat Room)
3:45:52 Demo
#VadimSavin #notjustdev #whatsapp
youtube.com/live/mxXJSVW4tRY
Let's build a Realtime Chat mobile application in React Native based on the Whatsapp UI design.
✨ Asset Bundle: assets.notjust.dev/whatsapp
⌨️ Source code: github.com/Savinvadim1312/WhatsappClone
⚛️ React Native Mastery is the ONLY course you need to Master mobile development with React Native & Expo 🚀
Enroll here: notjust.dev/react-native-mastery
If you are a beginner that wants to learn javascript and react native, or and advanced javascript developer that wants to get into mobile development using react native then this Livestream is for you. This is a perfect opportunity to follow along and build this application together with us, and add it to your portfolio as it will help you land your next job. If you finish the app, tag me on social media and I will give you feedback.
We will start building the Whatsapp clone from scratch, starting from setting up a React Native project using Expo and finishing with connecting the application with a GraphQL backend using AWS Amplify. We will walk through designing the UI layout of the app, structuring everything in components, and putting everything together. We will also implement navigation between screens, header bars, and tab bars for the Whatsapp menu.
For the backend, we will be using AWS Amplify, which is an amazing combination of tools and services from AWS, that helps us build mobile and web applications faster. It offers pre-made authentication components and flows, database, API (REST and GraphQL), storage, and much more. We will be using Graphql subscriptions for the realtime chat functionalities
Doing the Whatsapp clone yourself is a great opportunity to practice React Native, modern Javascript, Typescript, AWS Amplify. We are always trying to use the latest technologies and best practices, so that's another opportunity to learn something new, being it functional components, hooks, state, navigations or AWS and Amplify.
💬 Join the notJust Development gang and let's build together:
Twitter: twitter.com/VadimNotJustDev
Instagram: instagram.com/VadimNotJustDev
Facebook: facebook.com/notjustdev
LinkedIn: linkedin.com/in/vadimsavin
Discord: discord.gg/VpURUN2
Timecodes
0:00 Intro
9:47 Initialize the React Native project
15:22 Project structure
16:35 React Navigation
50:57 Chat List Item Component
1:31:05 Chat Rooms List (FlatList)
1:48:34 Chat Screen
2:51:17 Chat Input Component
3:23:16 Floating Button (New Chat Room)
3:45:52 Demo
#VadimSavin #notjustdev #whatsapp
About this tutorial
Vadim Savin published this 3:49:50 video tutorial. It has been watched 2,039,289 times on YouTube.
- Channel
- Vadim Savin
- Category
- Science & Technology
- Duration
- 3:49:50
- Views
- 2,039,289
- Likes
- 10,738
Tags
Share
This tutorial in other languages
- FRConstruire un temps réel chat App dans React (Native tutoriel pour les débutants) ????
- ESConstruir un chat en tiempo real App en React nativo (tutorial para principiantes) ????
- PTConstruir uma Realtime via Chat App em Reagir Native (tutorial para iniciantes) ????
- ITCostruire un tempo reale Chat App a React nativo (tutorial per principianti) ????
- DEErstellen Sie einen Echtzeit-Chat-App in der india reagieren (Tutorial für begginers) ????
- NLBouw een Realtime Chat App in React Indiaans (tutorial voor beginners) ????
- RUСоздание в реальное время чат приложения в React Native (учебник для начинающих) ????
- PLBudowanie aplikacji w czasie rzeczywistym Czat React Native (poradnik dla początkujących) ????
- JAリアクトネイティブ(初心者用のチュートリアル)でリアルタイムチャットアプリケーションを構築????
- ARبناء في الوقت الحقيقي الدردشة التطبيقات في رد فعل الأصلية (تعليمي للمبتدئين) ؟؟؟؟
- HIएक रीयलटाइम चैट अनुप्रयोग का निर्माण मूल निवासी प्रतिक्रिया (beginners के लिए ट्यूटोरियल) में ????
- IDMembangun Realtime obrolan App di Bereaksi asli (tutorial untuk pemula) ????