Become a ReactJS and Typescript Superhero + Project Zeus

Focused View

Desmond Oben .A

19:55:31

26 View

1. Introduction

1. Introduction.mp4

07:21

2. Project showcase.mp4

11:08

3. Setup.mp4

06:26

4. Hello world.mp4

26:07

2. Project Zeus

1. Get Code.html

2. Login Page Genesis.mp4

23:20

3. Input Reusable Component.mp4

14:30

4. Buttom Reusable Component.mp4

15:23

5. Background.mp4

10:04

6. Login and useState Hook.mp4

13:52

7. Events.mp4

11:48

8. Routing Basics.mp4

11:35

9. App Routing.mp4

11:55

10. Header.mp4

11:05

11. Firebase Setup.mp4

14:16

12. Env and Github Setup.mp4

15:50

13. Data Flow.mp4

03:24

14. Redux Setup And Intro.mp4

25:47

15. Signup Start.mp4

16:01

16. Error Handling.mp4

12:56

17. Loading Indicator.mp4

14:45

18. Add User To Collection.mp4

18:37

19. Get User Info.mp4

14:23

20. Set User.mp4

17:31

21. Unavailable Err Fix.mp4

05:32

22. ConvertTime and AvatarGenerator.mp4

16:15

23. UpdateUserInfo and getStorageUser.mp4

22:55

24. Reusable Icon.mp4

18:30

25. Header Icons.mp4

12:57

26. UserHeadProfile Component.mp4

14:21

27. User Menu Dropdown.mp4

16:14

28. Logout functionality.mp4

22:03

29. Conditional Rendering of Icons.mp4

14:46

30. Persisting User State and Protecting Route.mp4

24:05

31. Single Tasklist Structure.mp4

15:34

32. Multiple Task List.mp4

14:06

33. TaskList Slice.mp4

10:13

34. Add Tasklist.mp4

16:46

35. Get All TaskList.mp4

15:09

36. Display Task List with map.mp4

07:27

37. List Animation and Loader.mp4

18:24

38. Task List in Edit Mode.mp4

11:31

39. Edit and Save Task List.mp4

17:35

40. Delete Task List.mp4

21:43

41. Add Task to Task List.mp4

25:29

42. Task in Edit Mode.mp4

08:13

43. Collapsing Task.mp4

10:43

44. Edit and Save Task.mp4

26:17

45. Get Tasks for each Task List.mp4

14:38

46. Task Loader and Delete.mp4

12:20

47. Collpase All Tasks.mp4

18:02

48. Fix Logout Error.mp4

03:57

49. Profile UI.mp4

11:34

50. Generate Random Avatar.mp4

12:31

51. Save Profile Query.mp4

24:06

52. Save Profile Query Call.mp4

10:37

53. Signout.mp4

25:26

54. Signout Testing and Git.mp4

03:35

55. Chat Sidebar Component.mp4

17:15

56. Sidebar Left Active Tab.mp4

12:07

57. Get Users Query.mp4

18:35

58. Users Loader Indicator.mp4

10:30

59. Display Users.mp4

18:39

60. Fixing the Sidebar Left.mp4

13:31

61. Alert UI.mp4

11:23

62. Alert State.mp4

15:53

63. Start Chat Query.mp4

26:02

64. Get Chats Query.mp4

15:18

65. Get Chats Profile Info.mp4

27:56

66. Show and Select Chats User Profile.mp4

20:11

67. Sidebar Right.mp4

12:58

68. Chat Area Input.mp4

19:05

69. Message UI.mp4

13:30

70. Send Message Query.mp4

19:27

71. Get Messages Query.mp4

07:21

72. Send and Get Message on UI.mp4

23:13

73. Show New Message.mp4

09:10

74. Fixing Erros and Testing.mp4

17:56

75. Hosting.mp4

13:53

Description

Master ReactJS, Typescript, Firebase, Redux & Tailwind CSS: Build Chat & To-Do-List App + 'Project Zeus'

What You'll Learn?

Understand the core concepts of ReactJS and Typescript
Build React components, manage state, and handle events
Apply Typescript to enhance code quality, maintainability, and developer productivity
Implement actions, reducers, and store for managing application state
Understand the principles of state management using Redux Toolkit.
Develop a feature-rich to-do list application with Redux integration
Set up a Firebase project for real-time data management with Firestore
Implement Authentication and Authorization for secure chat access
Create a real-time chat application with messaging features
Customize and style components and layouts with Tailwind classes
Create modern and responsive user interfaces using Tailwind CSS.
Implement responsive design practices for a seamless user experience
Put the knowledge of ReactJS, Redux, Typescript, TailwindCSS and Firebase in creating a fully fleshed chat app project
Learn the best practices of implementing React and Typescript, Redux, and Firebase
You’ll be able to Debug ReactJS code with Error handling features
Incorporate advanced features like user profiles and notifications
Create "Project Zeus," a sophisticated and functional todo list and chat application with a modern UI
Work effectively in teams by using version control systems like Git
Learn how to deploy React applications to hosting platforms like Firebase hosting
Gain valuable experience in the development and deployment process

Who is this for?

Beginner HTML and CSS developer, curious about ReactJS, Typescript and Firebase

Beginner ReactJS developer who wants to learn Typescript with React

Beginner Typescript developer, curious about using Typescript with React

Experienced ReactTS developers can use this course as a refresher

What You Need to Know?

Know only the Basics of HTML and CSS

Know the basics of ReactJS

This course is beginner friendly, I take out time to explain everything for starters

More details

Description
Unlock the power of modern web development with our comprehensive course! Dive deep into ReactJS, Typescript, Redux, Firebase, and Tailwind CSS to build real-world projects and gain the skills to succeed in the fast-paced world of web development.
Key Highlights:
Master Essential Technologies: Learn the core concepts of ReactJS and Typescript, and build dynamic web applications with confidence.
Efficient State Management: Dive into the Redux Toolkit and discover the art of state management for seamless app development.
Real-time Applications: Create interactive applications with Firebase and Firestore, complete with secure authentication and authorization.
Sleek UI Design: Craft visually stunning, responsive interfaces with Tailwind CSS, making your apps look great on any device.
Project Zeus: Combine your skills to create a sophisticated chat app and a functional to-do list app, showcasing your abilities to future employers.
Debugging and Best Practices: Equip yourself with error-handling techniques and industry best practices for top-notch code.
Advanced Features: Implement user profiles, notifications, and more to take your applications to the next level.
Collaborative Development: Learn to work effectively in teams using Git, a vital skill in the world of web development.
Deployment Mastery: Get hands-on experience deploying your React applications to hosting platforms like Firebase Hosting.
Enroll now and embark on a journey that will equip you with the skills, experience, and projects to stand out in the competitive field of web development. Don't miss the opportunity to become a ReactJS and Typescript superhero and conquer the world of modern web development.

Course Objectives
ReactJS and Typescript Fundamentals:
Understand the core concepts of ReactJS and Typescript
Build React components, manage state, and handle events
Apply Typescript to enhance code quality, maintainability, and developer productivity
State Management with Redux Toolkit:
Implement actions, reducers, and stores for efficient state management.
Develop a feature-rich to-do list application with Redux integration.
Understand the principles of state management using the Redux Toolkit.
Real-time Data with Firebase and Firestore:
Set up a Firebase project for real-time data management with Firestore
Implement Authentication and Authorization for secure chat access
Create a real-time chat application with messaging features
Styling with Tailwind CSS:
Customize and style components and layouts with Tailwind classes
Create modern and responsive user interfaces using Tailwind CSS.
Implement responsive design practices for a seamless user experience
Project Development and Best Practices:
Put the knowledge of ReactJS, Redux, Typescript, TailwindCSS, and Firebase into creating a fully fleshed chat app project
Learn the best practices for implementing React and Typescript, Redux, and Firebase
Youâ€™ll be able to Debug ReactJS code with Error-handling features
Advanced Features and "Project Zeus":
Incorporate advanced features like user profiles and notifications
Create "Project Zeus," a sophisticated and functional todo list and chat application with a modern UI
Teamwork and Deployment:
Work effectively in teams by using version control systems like Git
Learn how to deploy React applications to hosting platforms like Firebase hosting
Gain valuable experience in the development and deployment process

Who this course is for:
Beginner HTML and CSS developer, curious about ReactJS, Typescript and Firebase
Beginner ReactJS developer who wants to learn Typescript with React
Beginner Typescript developer, curious about using Typescript with React
Experienced ReactTS developers can use this course as a refresher

User Reviews

Rating

average 0

Total votes0

Focused display

I am an enthusiast who is keen on IT and anything about it since my first steps to High School. During the past few years, I gained lots of experience in this field due to the strong desire of becoming an expert in my field. I'm pretty swift at learning new technologies which has contributed to my adaptive skills, easily adapting to new environments and new tech.“For me, web development is more than coding. It's a canvas with a blank page and I am the artist to paint it with colors of coding”.

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.