React video tutorial followed - Programming with Mosh
| Title | Topics Covered |
|---|---|
| React intro with typescript | Intro, Structure, Components, lists & conditional rendering , Events (click-events), State Hooks, Props |
React playlist - Net Ninja
| Title | Topics Covered |
|---|---|
| React introduction | What is react, project structure, setting up |
| Components | Components, Templates, Dynamic values in templates, Component trees, CSS Styling |
| Click events and Functions | Click events, calling functions on clicks, functions with parameters, etc. |
| Using state(useState hook) | useState hook |
| Outputting Lists | Map function to render lists |
| Props | Props, passing data to reusable components, passing functions as props, delete logic |
| useEffect hook | What the hook is, how to use dependencies, etc. |
| JSON Server | Setting up JSON Server with API Endpoints, fetching data using useEffect, conditional loading messages, handling fetch errors |
| Custom Hooks | Setting up custom hook useFetch to fetch data from API to be re-used |
| The React Router | How the react router works, installing, exact match routes, router links, useEffect cleanup and abort controller, route parameters, re-using custom hooks |
| React forms | Creating a new form, updating state with form change, submit events, making a POST request to the API, programatic redirects upon submission to form |
| Deleting and 404 pages | Deleting a blog with API request, showing 404 pages on invalid URL's |
Node Js playlist video tutorial followed - Net Ninja
| Title | Topics Covered |
|---|---|
| Node.js intro | Computer & code, Role of node.js, running js files using node |
| Node.js basics | Global object, Modules & Require, File system in Node, streams & buffer |
| Clients & Servers | Clients & Servers, IP Address & Domains, Creating server, Localhost & Port numbers |
| Requests & Responses | Request & Response object, Returning HTML pages, basic routing, status codes, redirects |
| NPM | 3rd party packages, installing packages globally (nodemon), package.json file & installing packages locally, dependencies & sharing code |
| Express apps | What is express, making an express app, routing & HTML pages, redirects & 404 pages |
| View Engines | View engines(at a glance), ejs view engine, passing data into views, partials, adding css |
| Middleware | What is middleware? Using next(), 3rd party middleware, static files |
| MongoDB | Intro to MongoDB, Setup with atlas, Mongoose, Getting & Saving data, Outputting documents in view |
| Get, Post & Delete Requests | Request types, Post requests, Route parameters, Delete requests |
| Express Router & MVC | Express Router, MVC Basics, Controllers |
MERN Stack video playlist - Net Ninja
| Title | Topics Covered |
|---|---|
| Intro to MERN | Intro |
| Express Setup | Basic Express Setup, Setup middleware |
| Router & API routes | Setting up the routers and API routes |
| Establishing database connection | Establishing mongodb connection, defining schema and model |
| Controllers | Creating controllers, adding functionalities |
| React App | Creating the React app, Routing, Navbar component |
| Fetching Data | useEffect hook,Setting up hooks, fetching data from API routes, Rendering workout details |
| New Workout Form | Adding react form and POSTing to database |
| Adding React Context | React context, useReducer hook, writing our own hook |
| Deleting Data | Deleting Workouts |
| Handling Error Responses | Creating Error Responses for invalid inputs |