Description
In this course, you will learn :
- Full-stack JavaScript.
- ReactJS.
- NodeJS.
- Rest API with LoopbackJS.
- Redux.
- Material-UI.
- Socket Programming.
Syllabus :
1. Getting Started with ReactJS
- Writing a React component
- React life-cycle
- The React state
- Understanding component props and re-rendering
- Importing CSS into React components
- Coding a calculator
2. Building a ReactJS Website
- React website setup
- Component children
- React routing
- Route parameters and HTML slicing
- Services and portfolio pages
- Working with forms in React
- Using Formik
- Yup form validation schemas
3. Rest API with LoopbackJS
- Setup of REST API using LoopbackJS
- Creating models
- Model observers
- Model relations
- ESLINT
- Subclassing access tokens
- Persisting data using MongoDB
- Creating data
- Updating data
- Finding model instances
- Deleting model instances
- Creating post collection
- Roles and rolemapping
- Applying access control to our post model
- Adding an editor role
- Creating a category model
- File storage and collection
- Custom remote methods and file uploads
- Creating login route
- Adding a login form
4. Redux and Material-UI
- Wrapping components
- Dispatching actions
- Creating a store and reducer
- Integrating remote API calls
- Applying middleware
- Material-UI intro
- Drawer and CSS
- Drawer collapsing and animations
- Icons, lists and links
- Main content class
- Persisting reducers using localStorage
- Basic tables
- Fetching posts and users from our API
- Fab buttons
- Setting up Redux, Material-UI and Formik for our add post page
- Material-UI forms with Formik
- Flex display and connecting our post form to our database via Redux
- Editing existing posts
- Uploading post images
- Integrating Quill as a content editor
- Loading posts on the front-end
- Loading more posts on demand
- Single post page
- Registering new accounts
- Posting comments and adding relations and ACLs to our API
- Deploying React apps with NGINX
- Deploying our API using PM2 and NGINX
5. WebSocket Chat Application
- Creating a chat app
- Creating our chat store
- WebSocket connections
- Sending socket messages
- Creating signup and login forms
- Writing account based logic
- Using auth tokens
- Styling the messenger
- Tracking logged in users
- Search functionality
- Creating new threads and sending to relevant clients
- Connecting on page load if already logged in
- Get threads on page load
- Disconnecting socket sessions
- Adding messages and sending to relevant clients
- Rendering messages client-side
- Rendering messages with user information
- Ejecting a React application