Book Image

JavaScript from Frontend to Backend

By : Eric Sarrion
Book Image

JavaScript from Frontend to Backend

By: Eric Sarrion

Overview of this book

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.

Related Content you might be interested in

Current Title:

Small book image
JavaScript from Frontend to Backend
Eric Sarrion
Jul, 2022 | 336 pages
Small book image
Full-Stack Web Development with Vue.js and Node
Aneeta Sharma
May, 2018 | 366 pages
Small book image
Vue.js 2 Cookbook
Andrea Passaglia
Apr, 2017 | 454 pages
Small book image
RESTful Web API Design with Node.js 10, Third Edition.
Valentin Bojinov
Apr, 2018 | 178 pages
Table of Contents (14 chapters)
Preface
Preface
Who this book is for
What this book covers
To get the most out of this book
Download the example code files
Download the color images
Conventions used
Get in touch
Share Your Thoughts
1
Part 1: JavaScript Syntax
Part 1: JavaScript Syntax
Free Chapter
2
Chapter 1: Exploring the Core Concepts of JavaScript
Chapter 1: Exploring the Core Concepts of JavaScript
Technical requirements
Types of variables used in JavaScript
Running a JavaScript program
Declaring variables in JavaScript
Writing conditions for conditional tests
Creating processing loops
Using functions
Summary
3
Chapter 2: Exploring the Advanced Concepts of JavaScript
Chapter 2: Exploring the Advanced Concepts of JavaScript
Technical requirements
Classes and objects
Arrays
Character strings
Multitasking in JavaScript
Using promises
4
Part 2: JavaScript on the Client-Side
Part 2: JavaScript on the Client-Side
5
Chapter 3: Getting Started with Vue.js
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
Adding methods in components
Using attributes in components
Using directives
Summary
6
Chapter 4: Advanced Concepts of Vue.js
Chapter 4: Advanced Concepts of Vue.js
Technical requirements
Managing events
Using the $event parameter
Assembling components
Using visual effects
Using a name for the effect
Producing an effect on several elements
Examples of commonly used effects
Summary
7
Chapter 5: Managing a List with Vue.js
Chapter 5: Managing a List with Vue.js
Technical requirements
Displaying application screens
Splitting the application into components
Adding an element to the list
Removing an element from the list
Modifying an element in the list
Summary
8
Part 3: JavaScript on the Server-Side
Part 3: JavaScript on the Server-Side
9
Chapter 6: Creating and Using Node.js Modules
Chapter 6: Creating and Using Node.js Modules
Technical requirements
Creating and using our own modules
Using internal Node.js modules
Using downloaded modules with npm
Summary
10
Chapter 7: Using Express with Node.js
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
Displaying views with Express
Summary
11
Chapter 8: Using MongoDB with Node.js
Chapter 8: Using MongoDB with Node.js
Technical requirements
Installing MongoDB
Connecting to the MongoDB database
Creating documents in MongoDB
Searching for documents in MongoDB
Updating documents in MongoDB
Deleting documents in MongoDB
Summary
12
Chapter 9: Integrating Vue.js with Node.js
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
Displaying list elements
Modifying an element in the list
Removing an element from the list
Summary
Thanks
Why subscribe?
13
Other Books You May Enjoy
Other Books You May Enjoy
Packt is searching for authors like you

Assembling components

Vue.js divides an application into a set of components. These components are then assembled to form the final application.

Let’s study an example of how to create components and then assemble the created components. The goal is to use three counters (associated with three input fields) like the one in the previous example, then display the total of these counters. The total updates, as numbers are typed into each of the input fields.

We will create two components for this:

  • The <counter> component is used to manage a counter.
  • The <counters> component allows you to manage the three counters together and display the total.

The index.html file will display the <counters> component in its template section:

index.html file

<html>
  <head>
    <meta charset="utf-8" />
    <script src="https://unpkg.com/vue@next"></script...
Previous Section
End of Section 5
Next Section