Full React Native Project Tutorial for beginners.

preview_player
Показать описание
Free React Native tutorial for Beginners: Get Started with React Native and learn how to build iOS and Android apps!

Timecodes.
0:00 - Project introduction
08:51 - Setting up React Native and Creating the project.
22:51 - Setting up a project structure
27:41 - React Navigation
53:48 - Context API
1:06:39 - Creating a Container Component
1:11:17 - Custom Text Input
1:35:20 - Custom Button
1:47:20 - Login Screen UI
2:00:29 - Register Screen UI
2:04:03 - Form Validation
2:19:29 - Managing Environment variables
2:25:51 - Axios Instance
2:36:15 - User Registration
3:04:12 - Message component
3:17:52 - Login a user
3:34:02 - Authentication Flow
3:39:42 - Custom navigation drawer
3:57:13 - Alert component
4:00:18 - Logout a user
4:06:13 - Toggle password visibility
4:09:27 - Route Params, Callbacks, messages, and more.
4:17:34 - Setting up react native vector icons
4:26:45 - Custom icon component
4:32:32 - Custom Modal
4:53:29 - Data Fetching
5:17:42 - Styling the Flat list
5:26:38 - Floating action button and create contacts UI design
5:40:35 - Creating a contact/ Post Request
6:04:52 - Switch component
6:10:57 - Creating a bottom sheet
6:24:54 - Image crop and camera photo picker
6:42:22 - Changing the package name on android
6:44:26 - Changing the App display name
6:46:22 - Creating custom launcher icons
6:53:25 - Creating the settings screen
7:01:39 - Managing user preferences
7:22:51 - Reading preferences and sorting contacts.
7:29:24 - Root navigation
7:34:21 - Axios auth interceptor
7:43:41 - Setting up firebase on ios and uploading images.
8:01:31 - React native firebase on android
8:08:55 - custom image component and contact details UI
8:29:52 - implementing component did update using hooks
8:36:14 - Header options
8:42:06 - Deleting a contact
8:58:12 - Editing a contact
9:28:56 - Add photo to a contact
9:45:53 - Splash screen on android
9:58:31 - Enable multidex on android
10:01:01 - Splash screen on ios
10:06:51 - Responsive Layouts and why react-native size matters.

Country codes gist.

Backend API Documentation.

Support the channel

Рекомендации по теме
Комментарии
Автор

Even paid courses don't teach this much. I salute you, bro

cwcfunclock
Автор

I have completed till 1 hrs and I must say the course content is amazing . Tried to follow the top instructors from udemy but their course material is outdated and everybody teaches the same old restaurant app . Thank you for uploading this valuable resource .

theaveragecoder
Автор

Just want to let you know that this is the only video that has actually helped me understand react native instead of using expo or just talking in abstracts. I thought I was going to fail my class but there may still be hope! 🙏🏻

Zolti
Автор

0:00 Project introduction
9:00 Setting up React Native and Creating the project
22:51 Setting up a project structure
27:51 React Navigation
53:48 Context API
1:06:39 Creating a Container Component
1:11:17 Custom Text Input
1:35:20 Custom Button
1:47:20 Login Screen UI
2:00:29 Register Screen UI
2:04:03 Form Validation
2:19:29 Managing Environment variables
2:25:51 Axios Instance
2:36:15 User Registration
3:04:12 Message component
3:17:52 Login a user
3:34:02 Authentication Flow
3:39:42 Custom navigation drawer
3:57:13 Alert component
4:00:18 Logout a user
4:06:13 Toggle password visibility
4:09:27 Route Params, Callbacks, messages and more
4:17:34 Setting up react native vector icons
4:26:45 Custom icon component
4:32:32 Custom model
4:53:29 Data Fetching
5:17:42 Styling the Flat list
5:26:38 Floating action button and create contacts UI design
5:40:35 Creating a contact / post request
6:04:52 Switch component
6:10:57 Creating a bottom sheet
6:24:54 Image crop and camera photo picker
6:42:22 Changing the package name on android
6:44:26 Changing the app display name
6:46:22 Creating custom launcher icons
6:53:25 Creating the settings screen
7:01:39 Maganing user preferences
7:22:51 Reading preferences and sorting contacts
7:29:24 Root navigation
7:34:21 Axious auth interceptor
7:43:41 Setting up firebase on ios and uploading images
8:01:31 React native firebase on android
8:08:55 custom image component and contact details UI
8:29:52 Implementing component did update using hooks
8:36:14 Header options
8:42:06 Deleting Contact
8:58:12 Editing a contact
9:28:56 Add photo to a contact
9:45:53 Splash screen on android
9:58:31 Enable Multidex on android
10:01:01 Splash screen on ios
10:06:51 Response Layouts and why React native-size matters

Thanks admin so much

datneanimation
Автор

C'est l'une des vidéos sur React Native les plus complets, les plus organisés, les plus faciles à comprendre. C'est juste un pur bijou. Merci pour votre infinie générosité.

mouhamaddiop
Автор

I've been looking a for tutorial from past 2 weeks which should be based on React native CLI but all i get is using expo only but thankfully today youtube algorithm recommended me this video.. Thank you so much ❤️

beginnerbytes
Автор

For everyone watching this video for the first time, make sure to read the React Navigation getting started guide by your own, since they're now at version 6 and the guide is a bit different from the one present in this video, with some an extra step for the Android setup, now needing for copying and pasting a function on the MainActivity file.

CharlExMachina
Автор

I'm an hour in and thank you! You're the only dev/teacher I found that sets up a navigation/context structure. I'm coming from react and the structure, flow, and navigation is similar but ofc react navigation compared to react router dom is still different. But yea man Thank you, like I said most tutorials do not present a layout or go over a navigation structure/flow for a complete app that uses context API and handling state if user is not logged in vs logged in. This is helping me out ALOT for my project and look forward to the rest of the tutorial. Much, much gratitude man, peace and love brother!

zb
Автор

Trading now will be very profitable great video

faithdawson
Автор

Brother, I'm speechless... This amazing video is, by no means, just insanely fantastic! I'll definitely be binging on this video to learn react native. Thank you so much for the efforts you put into creating this valuable content. You just got yourself another like and subscriber!

kymaniwilson
Автор

A lot of people are making to introduce React Native. But this video is amazing. Thank you.

satotakeru
Автор

This is the best course on React Native I have ever seen... thanks so much sir!!

msharma
Автор

Awesome Video!! Thanks Brother. Just a tip for others. I downloaded the video and then play it with VLC. VLC lets you jump back and forth 1sec, 10secs, 30 secs etc. Makes it a lot easier to study this material.

eddyv
Автор

This free science is very useful. The more successful it is for all of us. thanks bro!

skydomeblue
Автор

The best React Native tutorial on YouTube. Thanks Brother. You are truly a genius.

panshak
Автор

dude you just saved my job. thanks so much

nbo
Автор

I appreciate your effort in creating this fantastic tutorial...it has made my journey in mobile development so easy

idrisisholaagboola
Автор

Finally. Been finding for this kind of course. Thank you.

av
Автор

Feel More Comfortable and Relaxed :) when he says "We'll be using React Native CLI". BTW Thanks for such great content 😍

ismaeeel
Автор

Unfortunately I can't give more than one like to your course
kudos and thanks man. This is the best course on youtube

pavelsuchkov