React Native E-commerce App

Focused View

Dastagir Ahmed

5:42:00

80 View

1. Introduction

1.1 links.txt

1.2 rn-ecom-assets.zip

1. Introduction.mp4

06:45

2. Create and run the app

1. Creating react native app.mp4

04:03

2. Running the app for the first time.mp4

05:26

3. Home page and bottom bars

1. Loading custom fonts.mp4

07:04

2. Bottom Tab Navigator.mp4

10:27

3. Exporting Screens.mp4

01:00

4. Navigation and rendering the bottom tab.mp4

05:48

4. Home page and head bars

1. Head bar style.mp4

02:13

2. Setting up rows in react native.mp4

02:10

3. Cart Count absolute value.mp4

05:11

5. Home page and welcome page

1. Welcome Text.mp4

04:03

2. Welcome and reusable styles.mp4

03:12

6. Home page and search section

1. SearchBar.mp4

02:57

2. Search input.mp4

02:46

3. Search Camera Button.mp4

01:45

4. Positioning Search icons and Navigation to the search page.mp4

02:37

5. Set up search bar in the Search page.mp4

04:06

7. Home page and carousel

1. Carousel Slider.mp4

04:59

2. Carousel loop.mp4

00:49

8. Home page and heading

1. Creating Heading.mp4

01:04

2. New Rivals Heading.mp4

03:02

3. Heading Styles.mp4

02:28

9. Home page and card view

1. Introducing the Flatlist Component.mp4

02:22

2. Flatlist props.mp4

01:50

3. Render Components Flatlist Component.mp4

01:46

4. Render ProductCard to the flatlist.mp4

01:02

5. Product Card View.mp4

04:42

6. Using Images in React Native and styling them.mp4

01:39

7. Product details handling text.mp4

03:05

8. Price Text.mp4

01:30

9. Addding a Component on top of another using position.mp4

02:47

10. Navigating from a child component.mp4

03:18

11. Product Row style migration-.mp4

01:14

12. Products details page back button.mp4

05:48

10. Detail page

1. Product details Image.mp4

01:20

2. Title row.mp4

01:55

3. Title and price.mp4

01:49

4. Text with a rounded background.mp4

02:02

5. Mapping icons to form a rating bars.mp4

03:56

6. Cart Counter.mp4

02:27

7. Counter State.mp4

01:09

8. Increment Count.mp4

01:09

9. Decrement Count.mp4

01:05

10. Description.mp4

01:47

11. Justified Description Text.mp4

01:30

12. Product location and delivery row.mp4

02:00

13. location row.mp4

01:17

14. Buy now button.mp4

03:45

15. button text.mp4

02:13

16. Cart button.mp4

01:54

17. Product page adjustments.mp4

00:54

11. Backend section with endpoint, functions, routes, hooks and postman test

1. Creating Backend NodeJS project.mp4

02:30

2. Creating a node server.mp4

02:35

3. Creating database.mp4

02:57

4. Dotenv and connecting to the database.mp4

02:11

5. Running our server with db for the first time.mp4

01:13

6. Product Schema.mp4

01:50

7. Create Product Controller.mp4

01:50

8. Get Products Function.mp4

02:06

9. Get product by id.mp4

00:55

10. Search with Altas indexes.mp4

03:56

11. Product Router.mp4

02:33

12. Hooking routes to our server.mp4

02:23

13. Error fixing and testing endpoints in postman.mp4

04:01

12. Frontend and display data from the server

1. Creating a custom API hook.mp4

02:33

2. Fetch data with axios.mp4

01:53

3. Loading data with useEffect and fetching data manually.mp4

01:22

4. Hooking custom hook to Product Row.mp4

01:35

5. Activity Indicator and handling errors.mp4

02:03

6. Passing Data to a child component.mp4

01:28

7. Rendering Data on the ProductCard.mp4

00:46

8. Use useRoute to recieve params data and using it in Product DetailsPage.mp4

02:25

13. New Rivals frontend and detail

1. Creating new rivals.mp4

01:06

2. Setup navigation for NewRivals Page.mp4

01:21

3. Navigating to productList from Heading component.mp4

00:59

4. Components on top of each other.mp4

03:08

5. Product List Top bar.mp4

03:29

6. Creating ProductList Component.mp4

02:08

7. Loading data from the custom hook.mp4

03:12

8. Creating a grid view with a flatlist.mp4

02:33

9. Creating a grid with a flatlist.mp4

01:49

10. Creating a grid view.mp4

01:51

14. Product grid

1. Setting up search state variables.mp4

02:28

2. Testing our search input and state variables.mp4

01:17

3. Handling Search with axios and useState.mp4

02:03

4. Test Search endpoint in Postman.mp4

03:13

5. Logging research response and storing the search data in the state variable-.mp4

02:22

6. Handling Empty Search results.mp4

03:35

7. Displaying alist of search results.mp4

02:29

8. Creating a search Tile.mp4

05:40

9. Search Tile.mp4

04:31

10. Navigating to the product Details from the search tile.mp4

01:40

15. Work on Backend

1. Creating Models.mp4

03:30

2. Creating Schemas.mp4

02:48

3. Creating User Model.mp4

02:30

4. Creating the order Schema.mp4

04:44

5. Cart Schema.mp4

02:26

6. Creating Auth functions.mp4

02:51

7. CreateUser function.mp4

04:05

8. Save a user and sening back the response.mp4

01:39

9. Creating the loginUser function.mp4

08:18

10. auth router and hooking the router to index.mp4

03:17

11. Testing Auth endpoints in postman.mp4

02:36

12. Delete User function.mp4

03:35

13. GetUser function.mp4

02:49

14. User Routes and index.mp4

03:04

15. Test User endpoints in postman.mp4

03:34

16. Add to Cart funcition.mp4

06:45

17. Add to Cart function.mp4

05:49

18. GetCart function.mp4

01:29

19. GetCart function.mp4

04:19

20. Decrement Cart Item functionn.mp4

08:04

21. Cart router and hooking our router to index.mp4

05:10

22. Test the cart endpoints in postman.mp4

08:14

23. Order function and router.mp4

07:15

Description

Build Android and iOS E-commerce using React Native

What You'll Learn?

Build android and iOS e-commerce app using React Naitve
React Native basics and advanced techinques
Will learn nodejs and basics
Integrating nodejs with React Native app with mongodb
Integrating Stripe with React Native

Who is this for?

React Native beginners to advanced learners

What You Need to Know?

A little React Native knowledge or programming knowledge would help

More details

Description
In this React Native E-commerce app tutorial, you will learn how to use flutter to build an iOS and Android version app for cross platform.
We will start slowly with UI. First few hours we will focus on UI and build a beautiful UI.Â So in first few hours you will learn how to save data to async storage.
The UI will include the below features
1. view men's and women's item
2. scroll through items
3. view detail page for each items
4. add item to cart
5. remove items from cart
After a few hoursÂ we will start with restful API. To be able to work with restful api, we will use Nodejs for api building and work with mongodb for storing data in the database.
As we build APIs we will also implement JWT authentication and do login.
So eventually before we place order we have to login. Once we login we will place order using Stripe payment. Apart from that we will have search product and wish list.
At the end we will see how to host this in Railway server for free. So you will learn how to compile this for real world app and access from your android phone as apk and show the world your very first React Native e-commerce app.
Who this course is for:
React Native beginners to advanced learners

User Reviews

Rating

average 0

Total votes0

Focused display

I am Flutter and React Native course creator. I have over 90k followers on Youtube.As you follow me, you will be learning new Framework like Flutter and React Native and sharpen your programming skills.I started my programming journey in the university and then went to Intel corporation working with graphics card programmer.I am very good explaining stuffs and been programming for the last 12 years.

Udemy

View courses Udemy

Students take courses primarily to improve job-related skills.Some courses generate credit toward technical certification. Udemy has made a special effort to attract corporate trainers seeking to create coursework for employees of their company.