Course curriculum

  • 1
    Introduction and Setup
  • 2
    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
    • Writing a calculator part 1
    • Writing a calculator part 2
  • 3
    Building a ReactJS Website
    • React website setup
    • Component children
    • React routing
    • Route parameters and HTML slicing part 1
    • Route parameters and HTML slicing part 2
    • Services and portfolio pages part 1
    • Services and portfolio pages part 2
    • Working with forms in React part 1
    • Working with forms in React part 2
    • Using Formik
    • Yup form validation schemas
  • 4
    Building a Rest API with LoopbackJS
    • Setup of REST API using LoopbackJS
    • Creating models
    • Model observers
    • Model relations
    • ESLINT
    • Sub-classing access tokens
    • Persisting data using MongoDB
    • Creating data
    • Updating data
    • Finding model instances part 1
    • Finding model instances part 2
    • 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 part 1
    • File storage and collection part 2
    • Custom remote methods and file uploads part 1
    • Custom remote methods and file uploads part 2
    • Creating login route
    • Adding a login form
  • 5
    Redux and Material-UI
    • Wrapping components
    • Dispatching actions
    • Creating our store and reducers
    • Integrating remote API calls
    • Applying middleware
    • Material-UI intro
    • Drawer and CSS
    • Drawer collapsing and animations
    • Icons, lists, 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 part 1
    • Flex display and connecting our post form to our database via Redux part 2
    • Editing existing posts
    • Uploading post images part 1
    • Uploading post images part 2
    • Integrating Quill as a content editor
    • Loading posts on the front-end part 1
    • Loading posts on the front-end part 2
    • Loading more posts on demand
    • Single post page
    • Registering new accounts
    • Posting comments and adding relations and ACLs to our API part 1
    • Posting comments and adding relations and ACLs to our API part 2
    • Deploying React apps with NGINX
    • Deploying our API using PM2 and NGINIX part 1
    • Deploying our API using PM2 and NGINIX part 2
    • Deploying our API using PM2 and NGINIX part 3
  • 6
    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 part 1
    • Writing account based logic part 2
    • 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