Class Central is learner-supported. When you buy through links on our site, we may earn an affiliate commission.

LinkedIn Learning

Vue.js: Creating and Hosting a Full-Stack Site

via LinkedIn Learning

Overview

Prepare for a new career with $100 off Coursera Plus
Gear up for jobs in high-demand fields: data analytics, digital marketing, and more.
Create and host a full-stack site from scratch. Learn how to set up a front end using Vue.js, set up a back end using Node.js and MongoDB, and host your site on Heroku.

Syllabus

Introduction
  • Create and host a full-stack site with Vue.js
  • What you should know
  • Install Node.js and npm
  • What to expect from this course
1. Create a Vue.js Front End
  • Why Vue?
  • Set up and run a Vue project
  • Vue project structure
  • Routing in Vue
  • Add data, styles, and images
  • Create a product page
  • Create a product detail page
  • Create a shopping cart page
  • Create a navigation bar
  • Create a 404 page in Vue
  • Use modular components
  • Challenge: Modular components
  • Solution: Modular components
2. Create a Node Back End
  • Why Node.js?
  • Set up an Express server
  • Test servers with Postman
  • Route parameters in Express
  • Get data from a server
  • Use Nodemon to restart a server
  • Create and delete server data
3. Add MongoDB to Your Back End
  • Why MongoDB?
  • Download and install MongoDB
  • Add MongoDB to a Node.js server
  • Add MongoDB to GET endpoints
  • Create data in MongoDB
  • Delete data in MongoDB
4. Connect the Front End and Back End
  • Introduction to the axios library
  • Load data from the server, part 1
  • Load data from the server, part 2
  • Add items to the shopping cart
  • Improve the add-to-cart interface
  • Remove items from the cart
  • Challenge: Item already in cart
  • Solution: Item already in cart
5. Host Your Site
  • The release process
  • Build and serve a Vue front end
  • Set up Heroku and MongoDB
  • Use environment variables in Heroku
  • Push code to Heroku
Conclusion
  • Next steps

Taught by

Shaun Wassell

Reviews

4.8 rating at LinkedIn Learning based on 67 ratings

Start your review of Vue.js: Creating and Hosting a Full-Stack Site

Never Stop Learning.

Get personalized course recommendations, track subjects and courses with reminders, and more.

Someone learning on their laptop while sitting on the floor.