Book Image

Full-Stack Web Development with Vue.js and Node

By : Aneeta Sharma
Book Image

Full-Stack Web Development with Vue.js and Node

By: Aneeta Sharma

Overview of this book

Isomorphic JavaScript was the buzzword of the year 2017, allowing developers to utilize a single language throughout their web development stack and build cost-effective and scalable applications. MEVN is a one such modern web development stack consisting of web applications such as MongoDB, Express.js, Vue.js, and Node.js. Hands-On Full-Stack Web Development with Vue.js 2 and Node.js leverages the harmony of these technologies to help you create full-stack web applications. Starting with the core frameworks, this example-based guide explains all the key concepts of frameworks, how to set them up properly, and how to use popular modules to connect them together and make them work cohesively. You will learn all this with the help of real-world examples. In addition to this, you will be able to scaffold web application architecture, add an authentication layer, and develop the MVC structure to support the development of your application. You'll explore how to create data models for your applications and then write REST APIs by exposing your data model to your application. Solely orientated towards building a full, end-to-end application using the MEVN stack, this book will help you understand how your application development grows.

Related Content you might be interested in

Current Title:

Small book image
Full-Stack Web Development with Vue.js and Node
Aneeta Sharma
May, 2018 | 366 pages
Small book image
Learn Node.js by Building 6 Projects.
Eduonix Learning Solutions
Mar, 2018 | 310 pages
Small book image
Building Real-World Web Applications with Vue.js 3
Joran Quinten
Jan, 2024 | 318 pages
Small book image
ASP.NET Core and Vue.js
Devlin Basilan Duldulao
Jun, 2021 | 478 pages
Table of Contents (12 chapters)
Preface
Preface
Who this book is for
What this book covers
To get the most out of this book
Get in touch
Free Chapter
1
Introducing MEVN
Introducing MEVN
Evolution of the technology stack in JavaScript
Introducing MEVN
Installing Node.js
Introducing NVM
Introducing npm
Installing MongoDB
Introducing Git
Introducing GitHub
Summary
2
Building an Express Application
Building an Express Application
Introduction to Node.js
Introducing Express.js
Introduction to MVC
Creating view files for the Express.js application
Summary
3
Introducing MongoDB
Introducing MongoDB
Why MongoDB?
MongoDB queries
Introducing Mongoose
Adding validation with Mongoose
Summary
4
Introducing REST APIs
Introducing REST APIs
What is REST?
Introducing REST APIs
HTTP verbs
HTTP status codes
Introducing Postman
Summary
5
Building the Real Application
Building the Real Application
Introducing Vue.js
Installing Vue.js
Introducing vue-cli
Building a static application with Vue.js
Vue.js directives
Data binding
Handling forms with Vue.js
Communicating with servers
Loading dynamic content on the homepage
Summary
6
Building Authentication with passport.js
Building Authentication with passport.js
Introduction to passport.js
passport.js strategies
Setting up user registration
Setting up the user login
Serving static files for Vue components
Passport's Local Strategy
Summary
7
Building OAuth Strategies with passport.js
Building OAuth Strategies with passport.js
Passport's Facebook Strategy
Configuring Passport's Facebook Strategy
Passport's Twitter Strategy
Configuring Passport's Twitter Strategy
Passport's Google strategy
Configuring Passport's Google strategy
Passport's LinkedIn strategy
Configuring Passport's LinkedIn strategy
Summary
8
Introducing Vuex
Introducing Vuex
Traditional multi-web page application
An introduction to SPAs
SPA versus MPA
An introduction to Vuex
Core concepts of Vuex
Creating a simple Vuex application
Installing and using Vuex in a movie application
Summary
9
Testing an MEVN Application
Testing an MEVN Application
Benefits of writing tests
Introduction to unit tests
An introduction to end-to-end test
Technologies we will be using
Introducing Mocha
Introducing chai
Introducing sinon
Writing tests for Node.js server
Writing tests for Vue.js components
Writing e2e testing
Summary
10
Going Live
Going Live
Continuous integration
Introduction to Travis CI
Introduction to Heroku
Summary
11
Other Books You May Enjoy
Other Books You May Enjoy
Leave a review - let other readers know what you think

Building the Real Application

We have covered the basic components that we need to have knowledge of in order to build a full-stack JavaScript application. From this point on, we will work on building a whole web application using all of these technologies.

We will be building a movie rating application that will have the following features throughout this book:

  • A home page that lists all the movies with other attributes
  • There will be an admin section where the administrator will be able to add movies
  • The user will be able to log in and sign up
  • The user will be able to rate a movie
  • There will be a movie profile section where the logged-in user can rate the movie

So, let's get started.

Previous Section
End of Section 1
Next Section