Mô tả

Looking to build robust, full-stack mobile applications with React Native and Redux in the front-end and Node, Express, MongoDB and Mailtrap in the back-end? Look no further than this ultimate MERN Stack Audio Sharing App with React Native & Redux course!


This course is designed for React Native beginners, but it's important to have a solid foundation in web development and JavaScript. You'll learn the basics of React, Node for API building, TypeScript, and Redux inside the course. So, if you're comfortable working with JavaScript and have some familiarity with web development, this course is perfect for you!


Our step-by-step approach will guide you through everything you need to know, from setting up your development environment to deploying your app to the cloud. You'll start with the basics of React Native, building a foundation in the essential concepts and tools necessary for developing modern, robust applications.


From there, you'll dive into Redux, a popular and powerful state management tool that simplifies the complexity of app development by managing app state in a central location. You'll learn how to use Redux to manage state in your React Native app, and explore best practices for integrating it into your workflow.


In the back-end, you'll learn how to build a Node API with Express and MongoDB, gaining a solid understanding of RESTful API design principles, and learning how to leverage MongoDB to store and retrieve data for your app. Also we will use Mailtrap to handle emails for authentication.


The course also covers TypeScript, a powerful superset of JavaScript that adds static typing and other features, providing a safer and more efficient development experience. You'll learn how to leverage TypeScript to improve the maintainability and reliability of your codebase.


Inside this course, you'll learn how to handle API requests using React Query, a powerful library that simplifies and optimizes data fetching in React.


In addition, you'll also build a powerful audio player that supports both Android and iOS, and streams audio from the internet. You'll learn how to leverage React Native's audio APIs to build a user-friendly audio player, complete with playback controls, metadata display, and more.


Whether you're looking to build your own audio player, or you're interested in learning how to work with React Query, this course has everything you need to take your MERN stack development skills to the next level. So, what are you waiting for? Enroll now and start building amazing apps today!

Bạn sẽ học được gì

React Native From Basics to Advanced

Real world API building with Node JS, Typescript, Express, Mongodb

Easy state management with Redux Toolkit

Advance Animations For React Native

React Query to manage API requests

Yêu cầu

  • If you're comfortable working with JavaScript and have some familiarity with web development, this course is perfect for you!

Nội dung khoá học

39 sections

Environment Setup - Windows

4 lectures
Node JS
01:40
Typescript
00:48
Mongodb
02:27
Postman
01:44

Environment Setup - MAC

7 lectures
Installing Node JS
01:29
Installing Typescript
00:49
VS Code
00:48
Open With VS Code
01:00
Home brew
01:06
MongoDB
02:28
MongoDB Compass
01:03

Typescript Basic

10 lectures
What is TypeScript
08:55
Basic Types in JavaScript
03:48
Type Inferences
04:10
Basic Rules to Define Types
06:18
Types for Objects and Arrays
04:41
type Keyword & Optional Types
04:39
Functions
10:17
Interface
15:20
Generic Types
04:53
Any Type
05:19

React Native Direct

1 lectures
What if I don't want to build server?
08:40

API Basic

19 lectures
Node TS Setup
10:52
package, package-lock and node_modules
06:26
Basic Express Server
04:31
Node TS Professional Setup
10:04
The Plan
03:43
Sending Data With Post Request
06:13
Middleware Function
08:45
There s More
02:55
Setting up Mongodb
07:37
New Schema & Document
10:35
Types for Schema
06:45
_id and __v
02:08
Updating Document
09:14
Updating Document Part-2
04:48
Removing Document
05:06
Reading Document
04:31
HTTP Methods
03:46
Code Refactor
08:00
Code Refactor Part-2
09:05

React Basic

25 lectures
React
04:50
React Project Setup
05:25
JSX
11:47
Understanding from Ground
07:18
Basic App
06:22
Tailwind CSS Setup
06:02
What & Why Tailwind CSS
08:17
UI For Note Form
09:20
UI For Note Items
09:02
Resuable Component Part-1
06:31
Resuable Component Part-2
08:13
React State
07:26
Understanding useState
04:11
Update State From Single Place
08:59
Submitting Form
05:39
Fixing CORS
03:32
Rendering New Notes
08:59
useEffect
08:18
Fetching All Notes
05:09
Updating Notes
07:16
Updating UI
05:36
map vs map
04:04
Removing Note
07:11
View Note Details
07:06
Hiding Note
01:54

Project Setup For Real Project

7 lectures
Intro
00:30
Project Setup
07:51
The Plan
02:24
DB Setup
05:40
Environment Variables
04:17
Variables
04:19
Using Path Alias
06:51

Auth - Handling New Users

27 lectures
User Model
11:29
Creating New User
11:31
Types For Req Object
02:27
We Need a Validator
06:16
User Validation Schema
07:40
Schema Validator
12:32
Status Codes
02:54
Code Refactor
04:01
The Tool For Email
02:10
Sending First Email
08:59
Email Verification Token Schema
06:10
Sending Real Email
10:55
Hashing Email Verification Token
13:13
The Mail Template
05:38
Sending Mail With Attachment
10:28
Another Refactor
08:13
Hashing Password
03:12
Verifying Emails
10:30
Postman Environment Variable
02:08
Validating Token & ID
06:58
Re-verification Email
13:31
Forget Password Route
05:33
Sending Reset Password Link
08:10
Sending Link To Email
07:12
Verifying Password Reset Token
07:55
Validation Middleware
03:36
Updating Password
13:28

Reset Password UI

4 lectures
Creating Public Route
02:58
Update Password Form
05:37
Validating Token
17:47
Updating Password Through UI
15:03

Auth 2 - Sign in - Handling Old Users

6 lectures
Authentication vs Authorization
05:11
Sign in
18:22
Verifying User with JWT
09:30
Auth Middleware
05:43
Fixing Types
03:41
Private Routes
02:07

Basics of File Upload

9 lectures
File Upload
09:35
Uploading File to Local Dir
07:08
IMPORTANT - Formidable Update
00:24
File Parser (Middleware)
13:40
The Cloud Storage
05:15
Update Profile
10:39
Remove From Cloud
01:50
Refactor
04:39
Logout
11:13

Handling Audios

12 lectures
Audio Model
08:51
Validation For Audio
04:39
isVerified Middleware
02:37
Uploading Audio
13:13
Updating Audio
10:26
Favorite Model
04:08
Favorite Route Setup
02:58
Toggle Favorite
14:31
Update Audio Like
04:40
Get All Favorite Audios
13:26
Get isFav
04:40
Postman Auth
05:33

Playlist API

10 lectures
Playlist Model
05:00
Playlist Validation
06:19
Create Playlist
10:20
Fixing Playlist Model
01:54
Playlist Update Route
02:57
Playlist Update
08:37
Remove Playlist
09:58
Getting Playlist By Profile
06:13
Pagination
05:23
Get Playlist Audios
07:40

Profile Routes

6 lectures
Update Follower Route Setup
03:16
Update Follower Controller
10:11
Get All Uploaded Audios
07:39
Get All Public Uploads
04:03
Get Public Profile
03:35
Get Public Playlist
05:37

Histories

9 lectures
History Models
04:38
History Route Setup
01:54
History Validation Schema
04:07
Aggregation
04:31
Update History
20:00
What we did?
15:51
Remove History
07:25
Get All Histories
20:30
Get Recently Played
18:31

Few Final Routes

14 lectures
Some more routes
03:06
Get Latest Audios
04:41
Get Recommended Part 1
09:31
An Important Fix For Next Lecture
00:21
Get Recommended Part 2
12:04
Auto Generated Playlist
09:58
Task Scheduling
06:03
The Bug
03:23
Get Auto Generated Playlist Part 1
08:15
Get Auto Generated Playlist Part 2
08:39
Another Bug
04:08
Getting Followers
11:59
Getting Followings
03:19
Getting Followers Public
03:49

Final Fixes ( API)

10 lectures
Prevent Verified
02:03
Handling Async Errors
06:39
Secure Audio URL
01:14
Preventing Duplicate User
01:43
Pagination For Favorites
09:41
Getting Playlist Audios
12:40
Getting Playlist Audios 2
03:42
Getting Private Playlist
01:54
Get Is Following
03:39
Sending Category
00:41

RN Environment Setup (Windows)

3 lectures
Environment
18:22
Running First App
06:50
Important Note
01:25

RN Environment Setup (MAC)

4 lectures
React Native Android
07:01
Setting up Ruby
04:44
Xcode
01:44
Creating New Project
02:03

Running on Device

2 lectures
Physical Device
03:26
Bug Fixing
02:46

New Project Setup

5 lectures
New Project
06:05
Extentions
03:40
Custom Snippets
12:20
The Design
04:50
Path Alias
05:30

Auth

25 lectures
Sign up Screen
10:20
Separating UI Part 1
07:43
Separating UI Part 2
07:48
onchange
06:23
Custom Validation
07:19
Formik
07:34
Using YUP
06:38
Refactor Formik
14:41
Custom Button
04:38
Reanimated
03:01
Shake Animation
10:33
React Native Vector Icons Setup
08:21
Password Toggle Icon
06:48
Toggle Password
04:20
App Link
03:08
Circle UI
05:40
Refactor Circle
04:48
Rendering Logo & Title
04:36
Auth Form Container
05:31
Sign in Page
02:54
Lost Password
02:36
OTP Field UI
09:34
Forwarding Refs
06:21
Change Event OTP Field
08:15
Paste OTP Event
05:52

Navigation

12 lectures
Setting up Navigation
04:57
Stack Navigator
12:10
Sending Request to API
08:27
Localhost on Android
01:39
Refactor Client
02:17
Passing Data With Navigation
05:10
Verifying Email
05:22
Sign in
06:05
Loading Indicator
08:49
Busy onSubmit
05:38
Resend OTP
17:20
Lost Password
02:41

Redux Basics

10 lectures
What is Redux
06:19
Workflow of Redux
04:32
Redux Toolkit
01:32
Project Setup
10:18
The Plan
02:22
Creating Slice
11:28
Redux Store
06:05
Let's Understand
07:04
Using All of Them
16:23
Redux Devtools
06:33

Auth Store - Redux

9 lectures
Redux Store Setup
04:19
Completing Auth Slice
07:14
Updating Logged In State
02:29
Tab Navigator
07:28
Async Storage
06:08
Fetching isAuth
05:10
Loading Component
05:18
Navigator Theme
06:57
App Container
03:22

Audio Upload UI

12 lectures
File Selector UI
07:56
Upload Form Input
03:53
Upload Form Submit Button
01:48
Category Modal Part 1
10:08
Category Modal Part 2
09:51
Category Selector
08:05
Picking Document
10:38
Upload Form State
04:34
Audio Upload Form Validation
06:04
Submiting Form
09:41
Progress Bar
04:03
Upload Progress
11:39

App Notification

4 lectures
Notification Slice
07:52
Notification Component
10:28
Using Notification Component
03:53
Rendering Notification
12:07

Querying Data

11 lectures
React Query Setup
03:26
Using React Query
07:28
Refactor Hooks
05:40
Pulse Animation
04:35
Rendering Latest Audios
06:56
Refactor Latest Uploads
05:45
Loading UI
03:40
Fetching Recommended Audios
02:53
Rendering Recommended
04:31
Multi Column View
06:54
Recommended Loading UI
03:40

Custom Option Modals

12 lectures
Basic Modal Container
03:30
Handling Press Event
05:51
Options Modal
10:13
Adding to Favorite
08:39
Playlist Modal
10:23
Create Playlist Form
06:34
Combining All The UI
06:21
Playlist Form State
05:10
Creating New Playlist
05:04
Fetching Playlists
04:09
Updating Audio to Old Playlist
06:17
Refactor Auth Client
07:10

Profile Section

27 lectures
Top Tab Navigator
02:24
Using Top Tab Navigator
07:29
Fetching Profile Uploads
02:42
Rendering Uploaded Audios
06:41
Refactoring Audio List Item
02:42
Loading UI
04:00
Empty Title
02:22
Rendering Favorites
03:12
Rendering Playlists
09:36
Profile Container
05:57
Profile Container Part 2
06:23
Settings Button
03:16
Nestead Navigator
07:44
Custom Header
05:35
Settings UI
13:21
Logging Out
08:59
Profile Settings State
09:09
Updating Profile Name
08:53
React Native Image Crop Picker
06:10
There is a Problem
04:10
Android Permissions
07:04
Refactor Permission
02:17
Updating Profile Image
04:47
Re Verification Link
09:51
Navigating To Verification
05:54
Fixing Navigation
07:06
Refactor Verification
05:07

Audio Player

37 lectures
React Native Track Player
04:10
Register Playback Service
03:28
Playing Audio
08:19
The Problem With IOS
01:35
Audio Controller Hook
07:24
IMPORTANT UPDATE
00:32
Pausing Audio
05:33
Pausing The Correct Audio
07:49
Resume Audio
01:36
Play Animation
11:58
Selecting From New List
07:18
Playing From New List
05:42
Refactor Audio Card
04:57
Mini Audio Player
10:52
Hide Player
01:27
Play Pause Button
04:20
Toggle Play Pause
02:01
Buffering Indicator
02:09
Audio Progress
03:15
React Native Gesture Handler
02:33
Animated Modal
16:36
Audio Player UI
13:34
Audio Player UI - Seek Bar
07:21
Audio Player - Play Controlls
09:46
Audio Player Controller Methods
07:19
Audio Player - Next & Previous
06:07
Fixing App Modal
01:40
Playback Speed Selector Container
07:01
Playback Speed Selector
07:17
Playback Speed Controller
04:28
Audio Info
11:18
List Openner
02:37
Audio List Modal
06:06
Rendering Audios as List
06:02
Audio List Loading
03:14
Play Animation on List
01:49
Background Mode
09:45

History

14 lectures
Storing Progress
04:35
Sending History Request
06:36
Fetching History
05:58
Rendering Histories
07:08
Debounce
10:45
Clear History Button
02:30
Confirm Alert
05:16
Clearing Out History
05:31
Remove Single History
04:40
Removing Multiple Histories
07:29
Unselect on Navigate
02:15
Optimistic Update
13:45
Pull to Refresh
07:58
The Problem With History
02:23

Completing Home Screen

11 lectures
Recently Played
03:57
Rendering Recently Played
09:33
Wipe Android Data
01:25
Loading Recently Played
02:32
Player Everywhere
01:14
Fetching Auto Generated Playlist
03:18
Rendering Auto Generated Playlist
06:46
Adding Space
02:28
Playing From Everywhere
06:23
Fetching is Favorite
07:22
Toggling is Favorite
07:29

Public Profile

14 lectures
Public Profile Screen
08:05
Fetching Public Profile
03:46
Public Profile Container
02:36
Public Profile Navigator
03:21
Public Uploads
04:33
Public Playlist
05:00
Profile Navigator Fix
03:55
Playlist Audio Modal
09:04
Fix Audio Card Image
02:04
Fetching Playlist Audios
05:32
Opening Profile Playlists
01:51
Play From Playlist
01:54
Is Following
04:11
Follow UnFollow
06:33

Audio Update

3 lectures
Audio Form Refactor
15:11
Audio Edit Option
07:35
Updating Audio
09:09

Publishing API

17 lectures
Its Time To Publish
01:25
Git on Mac
01:37
Git Basic
09:03
Pushing API to Github
06:42
Copying Files
04:28
Publishing New App
05:27
Setting up Custom Domain
04:00
The Real Mail Service
05:07
The Real Mail Service 2
05:19
The React You May Need
00:14
Sending Email
10:02
Inbuilt Template
05:45
Using Other Templates
07:42
Hosting API
05:13
Live Database
04:38
Fixing Database Connection
06:04
Using Custom Domain & Fixing Mail
11:18

Publishing App

13 lectures
Using Real API
07:28
Using Custom Icon
05:50
Splash Screen
12:32
Renaming App
05:10
Creating Bundle
07:16
Releasing App
19:13
Releasing App 2
07:34
App is Ready But
04:49
Modal Fix
08:28
Infinite Scroll History Part 1
13:56
Infinite Scroll History Part 2
06:44
Paginated List
10:28
Releasing Update
02:45

Some Extra Features

8 lectures
Rendering Private Playlist
05:36
Refresning & Pagination Playlist
11:34
Playlist Options
06:45
Edit Playlist
12:50
Delete Playlist
02:35
Swipeable
13:58
Removing Audio From Playlist
10:29
Playlist Audio Conditional Remove
03:52

Bonus

1 lectures
You can try my other courses.
00:16

Đánh giá của học viên

Chưa có đánh giá
Course Rating
5
0%
4
0%
3
0%
2
0%
1
0%

Bình luận khách hàng

Viết Bình Luận

Bạn đánh giá khoá học này thế nào?

image

Đăng ký get khoá học Udemy - Unica - Gitiho giá chỉ 50k!

Get khoá học giá rẻ ngay trước khi bị fix.