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
Auf dieser Seite können Sie das Online-Video FullStack Todo App with ReactJS - MaterialUI - Firebase - CI/CD with Github Action mit der Dauer stunde minuten sekunde in guter Qualität ansehen, das der Benutzer FullStack JavaScript Channel 01 Oktober 2022 hochgeladen hat, den Link mit Freunden und Bekannten teilen, dieses Video wurde auf Youtube bereits 2,235 Mal angesehen und es wurde von 46 den Zuschauern gefallen. Viel Spaß beim Betrachtenden Zuschauern gefallen!