FullStack Todo App with ReactJS - MaterialUI - Firebase - CI/CD with Github Action

Published: 01 October 2022
on channel: FullStack JavaScript Channel

2,235

In this video, a Todo Application is created from scratch using ReactJS, MaterialUI for style with custom theme,
Firebase for Authentication, Storage of Data, and Hosting.
Github Action is used for CI/CD.
Unit Test and ESLint setup is also covered.

Repo: https://github.com/jintoppy/react-fir...
FrontendMentor Challenge: https://www.frontendmentor.io/challen...
Material UI - https://mui.com/

If you want to see the same application getting created in Angular: • FullStack Todo App with Angular - Material...

#react #reactjs #fullstack #firebase #material #materialui #authentication #cicd #githubactions

Timestamps

0:00 Intro
01:20 Demo
02:27 Approach
03:46 React Setup
05:13 ESLint & Prettier Setup
13:42 Material Setup
16:34 React Router
24:52 Firebase Setup
38:22 Authentication
51:11 Auth Provider
01:05:50 Add Todo
01:18:48 Theme Setup
01:31:45 Initial Layout
02:10:06 Custom Icons
02:22:25 Switching Themes
02:28:40 Display total number of Todos remaining
02:30:06 Deleting Todo/s
02:35:11 Private Route ( Auth Guard )
02:41:24 Logout
02:43:09 Mobile Layout
02:51:09 Filter Todos
02:54:10 Final Style Fixes
02:57:33 Github Repo & Branch Protection
02:59:23 Firebase Hosting
03:02:29 CI/CD
03:12:36 Unit Test
03:26:58 Conclusion

On this page of the site you can watch the video online FullStack Todo App with ReactJS - MaterialUI - Firebase - CI/CD with Github Action with a duration of hours minute second in good quality, which was uploaded by the user FullStack JavaScript Channel 01 October 2022, share the link with friends and acquaintances, this video has already been watched 2,235 times on youtube and it was liked by 46 viewers. Enjoy your viewing!

287,056