React, Typescript, Redux Toolkit etc: Create A Youtube Clone

Focused View

Ebuka Beluolisa

7:08:48

5 View

1. Introduction and Setup

1. What we are going to build.mp4

01:59

2. Create project.mp4

02:35

3. Fix package warning.mp4

00:37

4. Project files cleanup.mp4

01:26

5. Install styled-components.mp4

01:05

6. Creating the app container.mp4

02:54

7. Adding fonts.mp4

01:52

8. Adding Global styles.mp4

04:36

9.1 theme.ts

9. Introducing themes.mp4

05:46

10. Any type, Type annotations and inference.mp4

02:42

11. More on type annotations.mp4

03:11

12. More on Types.mp4

03:12

13. Finish setting up themes.mp4

03:09

14. Using theme.mp4

02:56

15. Union types.mp4

01:28

16. Function annotations.mp4

04:26

17. Using theme from React Context.mp4

10:34

2. Header Section

1. Creating the Header container.mp4

07:13

2. Left Section of the header.mp4

20:10

3. Create Auth Button and More Icon Button.mp4

13:20

4. Show tooltips and Dropdown settings.mp4

12:27

5.1 translations.ts

5. Settings container.mp4

19:53

6. Searchbar.mp4

14:44

7. Search by voice.mp4

17:40

8. Handling events.mp4

01:52

3. Side menu

1. Side menu container.mp4

11:59

2.1 sidemenu.zip

2. Side menu - Small.mp4

10:59

3. Side menu - Large.mp4

16:55

4. Categories & Search Features

1.1 categories.ts

1. Categories section.mp4

20:27

2. Fetching videos.mp4

10:41

3. Adding a loading backdrop.mp4

09:12

5. Homepage Videos section

1. Videos Container.mp4

11:31

2. Homepage video item.mp4

12:35

3. Fix video not showing bug.mp4

01:54

4. Adding video time.mp4

04:22

5. Adding video pic and title.mp4

15:00

6. Adding video name and date.mp4

04:05

7. Video shorts section.mp4

18:02

8. Show MoreLess Short videos.mp4

04:25

9. Shorts Video wrapup.mp4

11:59

6. Watch Video page section

1. Handling Routing.mp4

08:55

2. More Video Suggestions.mp4

06:04

3. More Videos suggestions wrapup.mp4

07:07

4. Watch video screen.mp4

13:58

5. Watch video title and description.mp4

08:11

6. Watch video - User details and subscribe button.mp4

11:52

7. Watch video details wrapup.mp4

11:24

8. App cleanup.mp4

08:34

9. Adding icon.mp4

01:07

10. App wrapup.mp4

00:47

7. React & Redux Toolkit

1. Installations.mp4

00:43

2. Introduction and Slice setup.mp4

07:07

3. Setting up the store.mp4

03:05

4. Creating custom hooks.mp4

02:43

5. Handling Dispatch and select.mp4

03:30

6. Actions with Payloads.mp4

01:09

8. Hosting (Make the app live)

1. Push to github.mp4

02:37

2. Deploy with netlify.mp4

01:06

3. Fix failed deployment.mp4

02:06

9. Other courses

1.1 Create a Pinterest Clone React & Styled components.html

1. Create a Pinterest Clone React & Styled components.mp4

00:50

Description

Create a beautiful real world portfolio project that makes your portfolio stand out. Using React, typescript , Redux etc

What You'll Learn?

I would build a beautiful real world project that makes my portfolio stand out from the rest, and gives me a lot of talking points in your interviews.
I will learn how to use the latest technologies, including React, Typescript, Redux toolkit, Styled-components, Netlify, Javascript, etc
I will learn how to use React and it's advanced concepts to breakdown and build any application that i want.
I will learn how to use Typescript with React to build more resilient applications
I will learn how to use Styled components to add Themes to my applications and to create highly customizable and re-usable components
I will learn how to use the latest Redux toolkit with React and Typescript.
I will learn how to add voice recognitions (speech to text) in my applications
I will learn how to support different languages in my applications
I will learn how to use advanced api and npm libraries with Typescript.
I will learn how to handle Routing with React-router-dom
I will learn how to host my app on the web along with Continuous integration.
This course would make me an advanced, confident, and modern Front-end developer developer.
I will sign up for this course ;)

Who is this for?

Anyone interested in learning how to build real world apps with React and it's ecosystem

Anyone looking to add a Massive real worl project to make them stand out from the rest

What You Need to Know?

Have a computer with Internet

A bit of experience with React would be helpful. I try to explain things as we go along

Be ready to learn an insane amount of awesome stuff

Prepare to build real world web apps!

More details

Description
Welcome, and thank you for you interest in this course.
Â Â Â I am a strong believer in learning by doing. If you wanted to know about how a technology works , you could have just read the documentation. But you're here to get your hands/keyboard dirty and see how it works, especially in the real world.
Â Â Â In this course we would make a clone of the second most popular website in the world , YouTube! . This would be a hands on practical guide. Which means you would learn about the how to use the latest and greatest technologies in the React ecosystem, as you build the project. This is the type of project that makes your portfolio stand out and gives you alot of talking points in your interviews.

Some cool features you would build :
Handle voice recognition to let a user search by voice.
Add different color themes to your project.
Support different languages in your application.
build highly customizable and re-usable components with styled-components.
and so much more !
Technologies you would learn work with:
React
Javascript
Typescript
Redux toolkit
Styled-components
React router dom
Netlify
Scss
Web design
Front end dev best practices
... etc
What are you waiting for ? We have some work to do , let's get started!Â Â :-)

Who this course is for:
Anyone interested in learning how to build real world apps with React and it's ecosystem
Anyone looking to add a Massive real worl project to make them stand out from the rest

User Reviews

Rating

average 0

Total votes0

Focused display

Hey! I'm Ebuka, a passionate Software developer looking to share my love for code with the world.I found myself spending alot of my free time designing and cloning popular websites , so i thought why not share how i do them and hopefully help someone. I would appreciate any feedback you have as i am always looking to learn and grow , not just as a developer , but also as a person.Thank you.

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.