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

Course Overview

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.

Course Circullum

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

Shaun Wassell

out of 5.0

5 Star 85%

4 Star 75%

3 Star 53%

1 Star 20%

Item Reviews - 3

Submit Reviews

5 stars 4 stars 3 stars 2 stars 1 star

Name

Review

Free Trial Available

Enroll Now

This Course Include: