JavaScript from Frontend to Backend: Learn full stack JavaScript development using the MEVN stack with quick and easy steps

✍ Scribed by Eric Sarrion

• Publisher: Packt Publishing
• Year: 2022
• Tongue: English
• Leaves: 336
• Category: Library

✦ Synopsis

Delve into the world of web development with Vue.js, Node.js, and MongoDB by exploring essential JavaScript concepts on the client side and the server side

Key Features

• Get up and running with JavaScript, the most popular web development language in the world
• Cut through the complexity and focus on the simple aspects of web development
• Build a simple web application using Vue.js, Node.js, and MongoDB

Book Description

JavaScript, the most widely used programming language in the world, has numerous libraries and modules and a dizzying array of need-to-know topics. Picking a starting point can be difficult. Enter JavaScript from Frontend to Backend. This concise, practical guide will get you up to speed in next to no time.

This book begins with the basics of variables and objects in JavaScript and then moves quickly on to building components on the client-side with Vue.js and a simple list management application. After that, the focus shifts to the server-side and Node.js, where you'll examine the MVC model and explore the Express module. Once you've got to grips with the server-side and the client-side, the only thing that remains is the database. You'll discover MongoDB and the Mongoose module. In the final chapter of this fast-paced guide, you'll combine all these pieces to integrate a Vue.js application into a Node.js server, using Express to structure the server code and MongoDB to store the information.

By the end of this book, you will have the skills and confidence to successfully implement JavaScript concepts in your own projects and begin your career as a JavaScript developer.

What you will learn

• Trigger deferred processing with JavaScript
• Implement Express and MongoDB with Node.js
• Build components with Vue.js
• Understand how to create and use modules with Node.js
• Familiarize yourself with npm
• Build a client-side application entirely with JavaScript
• Dive into full stack development with Vue.js, Node.js, and MongoDB

Who this book is for

This book is for JavaScript developers looking to strengthen their core JavaScript concepts and implement them in building full stack apps. Prior knowledge of HTML and CSS is a must.

Table of Contents

1. Exploring the Core Concepts of JavaScript
2. Exploring the Advanced Concepts of JavaScript
3. Getting Started with Vue.js
4. Advanced Concepts of Vue.js
5. Managing a List with Vue.js
6. Creating and Using Node.js Modules
7. Using Express with Node.js
8. Using MongoDB with Node.js
9. Integrating Vue.js with Node.js

✦ Table of Contents

Cover
Title Page
Copyright and Credits
Contributors
Table of Contents
Preface
Part 1: JavaScript Syntax
Chapter 1: Exploring the Core Concepts of JavaScript
Technical requirements
Types of variables used in JavaScript
Numerical values
Boolean values
Character strings
Arrays
Objects
Running a JavaScript program
Running a JavaScript program in a browser
Running a JavaScript program on a Node.js server
Differences between JavaScript code written for the browser and the server
Declaring variables in JavaScript
Using the const keyword
Using the var keyword
Using the let keyword
What if we don't use var or let to define a variable?
What is an uninitialized variable worth?
Writing conditions for conditional tests
Forms of writing instructions
Expressions used to write conditions
Nested test suites
Creating processing loops
Loops with while()
Loops with for()
Using functions
Function displaying the list of the first 10 integers
Function calculating the sum of the first 10 integers
Function calculating the sum of the first N integers
Summary
Chapter 2: Exploring the Advanced Concepts of JavaScript
Technical requirements
Classes and objects
Defining a class
Creating an object by using a class
Creating an object without using a class
Adding properties to a class
Adding methods to a class
Changing an object's property values
Using the class constructor
Merging one object with another
Arrays
Creating an array
Accessing array elements
Adding items to the array
Deleting array elements
Filtering elements in an array
Character strings
Creating a character string
Accessing characters in a string
Modifying a character string
Using regular expressions
Multitasking in JavaScript
Using the setTimeout() function
Using the setInterval() function
Using the clearInterval() function
Using promises
Part 2: JavaScript on the Client-Side
Chapter 3: Getting Started with Vue.js
Technical requirements
Using Vue.js in an HTML page
Creating our first Vue.js application
Using reactivity
Creating our first component
Inserting a component in the application file
Inserting a component from an external file
Adding methods in components
Defining methods in the methods section
Defining computed properties in the computed section
Using attributes in components
Using directives
The v-if and v-else directives
The v-show directive
The v-for directive
The v-model directive
Summary
Chapter 4: Advanced Concepts of Vue.js
Technical requirements
Managing events
Using the $event parameter
Checking that the entered value is less than 100
Allowing only digits to be entered
Assembling components
Using $emit() to communicate with a parent component
Using props to communicate with children
Using visual effects
When the element appears
When the element disappears
Using a name for the effect
Producing an effect on several elements
Examples of commonly used effects
The shrink effect
The opacity effect
The move-down effect
Summary
Chapter 5: Managing a List with Vue.js
Technical requirements
Displaying application screens
Splitting the application into components
Adding an element to the list
Using the component
Changing the appearance of the list using CSS code
Removing an element from the list
Modifying an element in the list
Transforming the element into an element
Exiting from the input field
Giving focus to the input field
Summary
Part 3: JavaScript on the Server-Side
Chapter 6: Creating and Using Node.js Modules
Technical requirements
Creating and using our own modules
Creating a module
Using the node_modules directory
Using the package.json file
Adding functionalities to the module
Using internal Node.js modules
Reading the contents of a file
Displaying file contents as strings
Using non-blocking file reading
Using downloaded modules with npm
Using the npm command
Using a downloaded module with npm
Summary
Chapter 7: Using Express with Node.js
Technical requirements
Using the Node.js http module
Installing the Express module
The MVC pattern used by Express
Using routes with Express
The initial content of the app.js file
Different types of routes possible
Analyzing routes defined in the app.js file
Adding a new route in the app.js file
Displaying views with Express
Summary
Chapter 8: Using MongoDB with Node.js
Technical requirements
Installing MongoDB
Using the mongo utility
Installing the mongoose module
Connecting to the MongoDB database
Creating documents in MongoDB
Describing document structure using schemas and models
Creating the document
Searching for documents in MongoDB
Writing search conditions
Retrieving and displaying the results
Updating documents in MongoDB
Deleting documents in MongoDB
Summary
Chapter 9: Integrating Vue.js with Node.js
Technical requirements
Displaying application screens
Building the app with Express
MongoDB database structure
Installing the Axios library
Inserting a new element in the list
Replacing the text and index attributes with the element attribute
Description of the Axios library for communicating between the client and the server
Using Axios with a POST type request (client side)
POST type request processing (server side)
Verifying the correct operation of the insertion in the database
Displaying list elements
Using Axios with a GET type request (client side)
GET type request processing (server side)
Modifying an element in the list
Using Axios with a PUT type request (client side)
PUT type request processing (server side)
Removing an element from the list
Using Axios with a DELETE type request (client side)
DELETE type request processing (server side)
Summary
Thanks
Index
About Packt
Other Books You May Enjoy