Что такое Node.js: для чего нужен, преимущества и как установить

Теперь давайте посмотрим, как это работает. Чтобы запустить REPL (оболочку Node), откройте cmd строку (в Windows) или терминал (в Mac или UNIX/Linux). Теперь укажите команду node, как показано ниже. 

Укажите команду в командной строке

Что умеет эта командная строка? Например, вы можете проверить практически любое выражение Node / JavaScript в REPL. Допустим, вы хотите узнать результат для 50 + 43:

Видим ответ в новой строке. Оператор + (знак плюс) также склеивает строки, как в браузерном JS

Вы также можете определить переменные и выполнить над ними какую-либо операцию.

Работа с переменными в консоли

Если вам нужно написать многострочное выражение или функцию JavaScript — нажимайте Enter всякий раз, когда хотите написать что-то в следующей строке (как продолжение кода) — терминале REPL появятся три точки (...), это означает, что вы можете продолжить на следующей строке. Напишите .break, чтобы выйти из режима продолжения.

Например, вы можете определить функцию и выполнить ее, как показано ниже

Вы можете выполнить внешний файл JavaScript, инициировав команду node fileName. Например, ниже приведен запуск mynodejs-app.js в командной строке / терминале и отображение результата.

console.log("Hello World");

Теперь вы можете инициировать запуск mynodejs-app из cmd:

Успех. Мы вызывали mynodejs-app

Когда вы закончите и понадобится закрыть REPL, укажите команду .exit и нажмите Enter.

Таким образом, вы можете выполнить любой код Node / JavaScript в оболочке node (REPL). Это даст вам результат, аналогичный тому, который вы получаете в консоли браузера Google Chrome.

Фреймворки и вспомогательные инструменты

Фреймворки Node (как правило) могут быть трех типов — MVC, Full-Stack Model-View-Controller и фреймворки REST API. 

• MVC-фреймворки (на основе Model-View-Controller). Эти фреймворки предлагают собственный шаблон проектирования, который разделяет логику веб-приложения на три основные части: модели, представления и контроллеры. Разделение задач разработки в таком виде делает чрезвычайно простым масштабирование веб-приложения. Express.js — каноничный пример MVC-фреймворка.
• Полностекевые MVC-фреймворки. При создании веб-приложений в realtime-режиме полнофункциональные MVC-фреймворки дают огромное количество строительных блоков, библиотек, шаблонизаторов и ряд других возможностей для разработки. Кроме того, такие фреймворки могут применяться как в разработке фронтенда, так и бэкенда веб-приложения.
• REST API. Фреймворки Node ориентированы на более быстрое создание приложений с помощью готового REST API. Это означает, что вам не нужно беспокоиться об архитектурных стилях сетевых приложений и других сопутствующих вопросах.

Почти все эти фреймворки предоставляют готовый интерфейс программирования, что значительно экономит время веб-разработчика. 

Вспомогательные инструменты

Теперь посмотрим на конкретные инструменты, которые дополнят «Нод».

Derby.js. Полнофункциональный инструмент для создания «Нод»-приложений. Derby.js отличный выбор для развертывания приложений в реальном времени, поскольку позволяет одному и тому же коду работать на Node (сервер) и в браузере. Таким образом, вам не нужно беспокоиться о написании отдельных кодов для части представления. 

Можно даже парсить шаблоны в браузере. Просто отредактируйте шаблон, как показано выше 

Koa.js. Фреймворк нового поколения. Инструмент особенно удобен при создании API (ведь он может эффективно работать с HTTP-посредниками с помощью стекоподобного метода). Кроме того, он конструктивно нормализует недостатки Node. С помощью этого фреймворка можно поддерживать различные формы контента, предоставляемого пользователям по одному и тому же URL.

Koa похож на многие другие системы промежуточного ПО (Ruby's Rack, Connect)

Loopback.js. Обеспечивает наилучшее соединение с любым фреймворком Node. Это означает, что вы можете интегрировать его с несколькими различными API-сервисами. Loopback.js лучше всего работает с REST API: платформа обеспечивает отличную гибкость, соединяясь с широким спектром устройств, браузеров, баз данных и сервисов. Структурированный код фреймворка помогает поддерживать модули приложений и высокую скорость разработки.

Эти компании используют Loopback.js

Meteor.js. Одно приложение, один язык. Если вы ищете фреймворк для Javascript и использующий только один язык, Meteor.js — идеальный выбор (с открытым исходным кодом). Он автоматически меняет данные среди клиентов. Самое главное — фреймворк удобен для различных операционных систем, включая, Android, iOS и настольных приложений. Meteor также имеет обширные библиотеки и крутые функции для тестирования цепочки клиент / сервер. 

Три причины выбрать Meteor.js в качестве основного фреймворка

Создаем первое приложение на Node.js 

Для создания первой программы вам понадобятся два компонента: Node и npm, установленные на вашем компьютере. 

Откройте консоль и выполните пару команд. Чтобы проверить, установлен ли Node, выполните:

node -v

Чтобы проверить, установлен ли Node, выполните:

npm -v

Помимо Node, вам понадобится установленный и запущенный сервер MySQL. Вы можете использовать автономный установщик MySQL или дистрибутивы серверов со встроенным MySQL, такие как WAMP (либо кросплатформенная сборке сервера XAMPP).

Создание формы входа в систему на Node.js

Начнем с создания новой папки для приложения и перейдем в нее с помощью командной строки с директивой cd:

cd path/to/your/folder

Затем — выполните следующую команду для установки зависимостей, необходимых для нашей формы:

npm i express mysql dotenv hbs bcryptjs

Давайте разберем для чего нужна каждая из библиотек, которые мы используем:

• Express: для создания API и веб-маршрутов и настройки бэкенда приложения.
• Bcryptjs: для хэширования паролей.
• MySQL: для подключения к нашему локальному серверу MySQL.
• hbs: для рендеринга HTML на сервере.
• dotenv: для хранения переменных окружения, которые не должны быть открыты в исходном коде приложения.

Кроме того, мы рекомендуем установить nodemon, который автоматически перезапускает сервер при обнаружении изменений файлов, экономя время. Установите его с помощью следующей команды:

npm i nodemon --save

Наконец, запустите package.json с помощью любого удобного редактора и добавьте следующее поле в объект scripts:

"start": "nodemon app.js"

Теперь мы закончили с настройкой проекта. Далее — мы подключимся к БД MySQL и создадим таблицу для хранения информации о входе пользователей.

Настройка подключения к базе данных в Node.js

Три простых шага:

1. Начните с создания новой базы данных в вашей среде MySQL (ее имя будет login-db).
2. После этого — создайте таблицу users с ID, именем, email и паролем.
3. Установите ID в INT и AUTOINCREMENT, имя, email и пароль в VARCHAR.

   В итоге база данных в phpMyAdmin будет выглядеть следующим образом:

   

   В нашем случае БД выглядит так

4. Затем — создайте файл .env в корневой папке вашего приложения. Внутри .env — добавьте имя базы данных, домен хоста, имя пользователя и пароль к соответствующим именам переменных. Вот значения по умолчанию для БД MySQL:
   

   DATABASE = login-db
   DATABASE_HOST = localhost
   DATABASE_ROOT = root
   DATABASE_PASSWORD =

5. После установки переменных — создайте app.js-файл в корне. Откройте файл в текстовом редакторе и импортируйте следующие зависимости:
   

   const express = require('express');
   const mysql = require("mysql")
   const dotenv = require('dotenv')

6. Затем— создайте приложение Express:
   

   const app = express();

7. После этого — укажите путь к переменным окружения:
   

   dotenv.config({ path: './.env'})

   Здесь мы приказываем серверу найти .env в том же каталоге, что и app.js.

8. Далее — обращаемся к переменным из process.env и передаем их в соответствующие свойства соединения:
   

   const db = mysql.createConnection({
       host: process.env.DATABASE_HOST,
       user: process.env.DATABASE_USER,
       password: process.env.DATABASE_PASSWORD,
       database: process.env.DATABASE
   })

9. Теперь, когда мы настроили соединение с учетными данными базы данных, подключите базу данных:
   

   db.connect((error) => {
       if(error) {
           console.log(error)
       } else {
           console.log("MySQL connected!")
       }
   })

10. Соединение будет успешным, либо — неудачным. В случае неудачи мы увидим error в обратном вызове. В противном случае — будет выведена строка "MySQL connected!"
11. Наконец, запустите сервер, выполнив в terminal простейшую команду:
    

    npm start

Если все прошло успешно, вы увидите, что MySQL is connected.

Теперь, давайте создадим домашнюю страницу. Это не сложно.

Настройка домашней страницы

Вот алгоритм действий:

1. 1. В корне добавьте новую папку views.
   2. Затем в папке views создайте index.hbs, register.hbs и login.hbs. Как вы уже догадались, это файлы Handlebars для домашней страницы, страницы авторизации и страниц регистрации.
   3. Теперь для каждой из них включите базовую HTML-разметку:
      

      

      
      

      Здесь мы связали два элемента с CSS-сайта и библиотекой Bootstrap CSS. Мы также создали навигационное меню, которое будет повторно использоваться на всех страницах и включать ссылки на страницы входа и регистрации.

   4. Далее, внутри index.hbs, используйте следующую разметку в тегах body, чтобы добавить «джамботрон» на главную страницу вашего сайта:
      

      

   5. Затем укажите view engine в app.js (в качестве Handlebars):
      

      app.set('view engine', 'hbs')

   6. Оттуда же импортируйте path, чтобы указать статические активы, используемые в ваших шаблонах Handlebars:
      

      // other imports
      const path = require("path")
      
      const publicDir = path.join(__dirname, './public')
      
      app.use(express.static(publicDir))

   7. Затем — зарегистрируйте маршрут рендеринга index.hbs на главной странице:
      

      app.get("/", (req, res) => {
          res.render("index")
      })

   8. Наконец, настройте порт для приложения в app.listen():
      

      app.listen(5000, ()=> {
          console.log("server started on port 5000")
      })

   9. Запустите сервер, выполнив npm start, затем — перейдите на localhost:5000 для просмотра домашней страницы:

Пример страницы авторизации на Node и MySQL

Далее — создадим формы регистрации и входа.

Создание форм входа и регистрации в Node.js

Мы создадим HTML-форму с входами для имени пользователя, email, пароля и его подтверждения. Форма будет отправлять данные в маршрут, который мы указали в action.

Вот пошаговая инструкция, как создать HTML-форму регистрации и авторизации.

1. Откройте файл register.hbs во views и включите следующую разметку body и после nav :
   

   

2. В app.js зарегистрируйте маршрут к странице регистрации и сохраните файл:
   

   app.get("/register", (req, res) => {
       res.render("register")
   })

3. После этого — перейдите в браузер и выберите в навигационной панели пункт «Регистрация». Вы должны увидеть форму регистрации:

   

   Форма регистрации выводится корректно

Теперь настроим форму входа:

1. Чтобы создать форму входа, откройте login.hbs внутри views и используйте ту же форму, что и выше.
2. Удалите inputs и labels для подтверждения e-mail и пароля.
3. Измените атрибуты id и название карточки с Register Form на другое название (например, Login Form).
4. Далее — зарегистрируйте маршрут входа в app.js:

app.get("/login", (req, res) => {
    res.render("login")
})

Сохраните файлы и перейдите в браузер. Протестируйте функциональность формы для логина:

Форма выводится корректно, когда мы выбираем «Авторизация» на верхней панели

Теперь, когда мы закончили работу над фронт-эндом, давайте настроим регистрацию пользователя в бэкенде.

Регистрация пользователя

Значения формы будут отправлены в маршрут /auth/register, когда регистрационная форма будет отправлена. Вот пошаговая инструкция, что нужно сделать:

1. В app.js начните с импорта bcrypt:
   

   const bcrypt = require("bcryptjs")

2. Далее — настройте сервер Express на получение значений формы в формате JSON:
   

   app.use(express.urlencoded({extended: 'false'}))
   app.use(express.json())

3. Затем — создайте auth/register и получите значения формы пользователя:
   

   app.post("/auth/register", (req, res) => {    
       const { name, email, password, password_confirm } = req.body
   
       // db.query() code goes here
   })

4. Теперь, когда у вас есть значения, сделайте запрос к базе данных, чтобы проверить, находится ли электронная почта на сервере. Таким образом, пользователь не сможет зарегистрироваться несколько раз с одним и тем же электронным адресом:
   

   db.query('SELECT email FROM users WHERE email = ?', [email], async (error, res) => {
          // remaining code goes here
       })

   
   

   Если при выполнении запроса произошла ошибка, будет выведен статус error :

   if(error){
               console.log(error)
           }
           // other code

5. Затем проверьте, есть ли результат и совпадают ли два пароля. Если все условия верны, переделайте страницу регистрации, чтобы уведомить пользователя о том, что его email уже используется (либо, что указанные пароли различаются)
   

    if( result.length > 0 ) {
               return res.render('register', {
                   message: 'This email is already in use'
               })
           } else if(password !== password_confirm) {
               return res.render('register', {
                   message: 'Passwords do not match!'
               })
           }
          // other code

6. Если условия выше не являются истинными, пользователь будет добавлен в базу данных. Зашифруйте пароль и поместите его в базу данных вместе с другими значениями:
   

   let hashedPassword = await bcrypt.hash(password, 8)
   
           db.query('INSERT INTO users SET?', {name: name, email: email, password: hashedPassword}, (err, res) => {
               if(error) {
                   console.log(error)
               } else {
                   return res.render('register', {
                       message: 'User registered!'
                   })
               }
           })

7. Важно: для вывода пользовательских сообщений нужно поправить register.hbs и включить следующий шаблон под div:

    

   

8. Наконец, сохраните все изменения в файле и протестируйте поведение формы в браузере:

   
   Все работает корректно. Пользователь смог отправить свои данные через форму.

Также обязательно посмотрите наш бесплатный видеокурс. Мы создали полноценный API и дали пошаговую инструкцию, как вы сможете сделать то же самое самостоятельно.

Резюме + советы по обучению

Напоследок — мы подготовили 8 причин, почему стоит использовать Node:

1. Неблокирующий код — самая веская причина выбрать Node в качестве сервера. 
2. Node полностью ориентирован на события. Большая часть кода — выполняется на основе обратных вызовов. Такой подход помогает приложению не уходить в сон, а становиться доступным для других запросов.
3. Быстрая обработка. Node использует движок V8 JavaScript Runtime (да, это движок, встроенный в широко известный Google Chrome). Node имеет собственную обертку над этим движком, что дает дополнительные возможности для создания веб-приложений. И обертка Node, и движок V8 JavaScript — написаны на C, что делает их действительно быстрыми. «Нод» действительно намного быстрее, чем тот же Ruby, Python или Perl.
4. Обработка одновременных запросов. Node может обрабатывать сотни и даже тысячи соединений в одно время— с минимальными расходами на один процесс.
5. Единая среда. Использование JavaScript как на веб-сервере, так и в браузере уменьшает несоответствие между двумя средами программирования, что позволяет передавать структуры данных через JSON (ведь они нужны по обе стороны). 
6. Дублирующийся код валидации формы может быть разделен между сервером и клиентом. Практично и экономит время.
7. Легко изучить. Node не является чем-то новым или чем-то принципиально сложным. По сути — этот тот же JavaScript. Поэтому разработчикам JavaScript не нужно прилагать много усилий для изучения Node.
8. Популярность и сообщество. Многие начинающие изучать веб уже сталкивались с JavaScript. JS — один из самых популярных ЯП во всём мире. Популярный язык означает и популярное сообщество, большое количество обучающих материалов, книг и форумов. Большое сообщество гарантирует, что вы сможете получить помощь по любому, даже самому нестандартному вопросу.

Для тех, кто хочет овладеть серверной разработкой и конкретно «Нодом», мы подготовили полноценный курс. Это программа для тех, кто уже хорошо разбирается в JavaScript, имеет опыт веб-разработки и знаком с основными технологиями. При помощи этого курса вы научитесь создавать серверную часть веб-приложений — всего з 6 недель. А чтобы изучение Node проходило максимально эффективно — обязательно возьмите на заметку нашу подборку лучших книг по «Нод». Это восемь книг, которые должен прочитать каждый, кто хочет сделать эту платформу своим основным инструментом.