Uthena

Course description

If you would like to master JavaScript and get started as a full-stack web developer, you are going to LOVE this course! Learn full-stack JavaScript development working on coding projects using ReactJSNodeJSLoopbackJSReduxMaterial-UI and socket programming.

We will work on the following 3 coding projects in this course:

Calculator Application - We will go over the basics of what React is, how to create components and how to work within the React life-cycle.

Weblog - We will build a feature rich blog app using React and LoopbackJS. We will begin to explore the full-stack elements of JavaScript by coding our own REST API, and how the front and back-end can communicate with each other.

Chat Application -  We will explore socket programming. With a web socket you can keep clients connected on the server side. We will program a chat app where you can create a user account, add other users and then message back and forth with them.

This course was designed for students who have a basic understanding of front-end web development. It will be helpful if you know how to use HTML and CSS. A basic understanding of JavaScript is not required, but it will help you get up to speed with the tutorials.

All of the lectures are downloadable for offline viewing. English captions are available within the course.

Thank you for taking the time to read this and we hope to see you in the course!


Who this course is for:
  • Web development students interested in mastering JavaScript.


Requirements:

  • A basic understanding of HTML, CSS and JavaScript.


What you'll learn:

  • Full-stack JavaScript
  • ReactJS
  • NodeJS
  • Rest API with LoopbackJS
  • Redux
  • Material-UI
  • Socket Programming

Course curriculum

    1. Welcome to the course!

      FREE PREVIEW
    2. Environment setup

    3. Anatomy of a React project

    1. Writing a React component

    2. React life-cycle

    3. The React state

    4. Understanding component props and re-rendering

    5. Importing CSS into React components

    6. Writing a calculator part 1

    7. Writing a calculator part 2

    1. React website setup

    2. Component children

    3. React routing

    4. Route parameters and HTML slicing part 1

    5. Route parameters and HTML slicing part 2

    6. Services and portfolio pages part 1

    7. Services and portfolio pages part 2

    8. Working with forms in React part 1

    9. Working with forms in React part 2

    10. Using Formik

    11. Yup form validation schemas

    1. Setup of REST API using LoopbackJS

    2. Creating models

    3. Model observers

    4. Model relations

    5. ESLINT

    6. Sub-classing access tokens

    7. Persisting data using MongoDB

    8. Creating data

    9. Updating data

    10. Finding model instances part 1

    11. Finding model instances part 2

    12. Deleting model instances

    13. Creating post collection

    14. Roles and rolemapping

    15. Applying access control to our post model

    16. Adding an editor role

    17. Creating a category model

    18. File storage and collection part 1

    19. File storage and collection part 2

    20. Custom remote methods and file uploads part 1

    21. Custom remote methods and file uploads part 2

    22. Creating login route

    23. Adding a login form

    1. Wrapping components

    2. Dispatching actions

    3. Creating our store and reducers

    4. Integrating remote API calls

    5. Applying middleware

    6. Material-UI intro

    7. Drawer and CSS

    8. Drawer collapsing and animations

    9. Icons, lists, links

    10. Main content class

    11. Persisting reducers using localStorage

    12. Basic tables

    13. Fetching posts and users from our API

    14. Fab buttons

    15. Setting up Redux, Material-UI and Formik for our add post page

    16. Material-UI forms with Formik

    17. Flex display and connecting our post form to our database via Redux part 1

    18. Flex display and connecting our post form to our database via Redux part 2

    19. Editing existing posts

    20. Uploading post images part 1

    21. Uploading post images part 2

    22. Integrating Quill as a content editor

    23. Loading posts on the front-end part 1

    24. Loading posts on the front-end part 2

    25. Loading more posts on demand

    26. Single post page

    27. Registering new accounts

    28. Posting comments and adding relations and ACLs to our API part 1

    29. Posting comments and adding relations and ACLs to our API part 2

    30. Deploying React apps with NGINX

    31. Deploying our API using PM2 and NGINIX part 1

    32. Deploying our API using PM2 and NGINIX part 2

    33. Deploying our API using PM2 and NGINIX part 3

    1. Creating a chat app

    2. Creating our chat store

    3. Websocket connections

    4. Sending socket messages

    5. Creating signup and login forms

    6. Writing account based logic part 1

    7. Writing account based logic part 2

    8. Using auth tokens

    9. Styling the messenger

    10. Tracking logged in users

    11. Search functionality

    12. Creating new threads and sending to relevant clients

    13. Connecting on page load if already logged in

    14. Get threads on page load

    15. Disconnecting socket sessions

    16. Adding messages and sending to relevant clients

    17. Rendering messages client-side

    18. Rendering messages with user information

    19. Ejecting a React application

About this course

  • $27.81
  • 96 lessons
  • 24.5 hours of video content

Meet your instructor!

Joseph Delgadillo
Best-Selling Instructor

The digital age is upon us. Would you like to build/protect the systems that shape our future?

I am here on Uthena to produce valuable educational resources for students who wish to learn skills related to information technology, network security, programming languages and much more. Enroll in one of my courses for a practical, down to earth approach to learning.

Take this course today!

"The Complete Full-Stack JavaScript Course!"