Введение в NodeJ

Что такое NodeJS? Node js — это среда сервера javascript, она позволяет вам запускать javascript, который изначально является языком интерфейса, для интерпретации на бэкэнде.

Определение узла: Node.js использует управляемую событиями неблокирующую модель ввода-вывода, что делает его легким и эффективным. Я не самый большой поклонник того, что это основное определение, поскольку оно не очень удобно для новичков, поэтому я собираюсь разобрать его по частям.

Сначала давайте рассмотрим, что такое код, управляемый событиями. Код, управляемый событиями, — это код в вашей программе, выполняемый событиями. Таким образом, определенные действия могут запускать определенный код, например, щелчок мышью, нажатие клавиши или триггер, исходящий откуда-то извне приложения. Поэтому, когда приложение работает, оно обнаруживает события и обрабатывает их с помощью соответствующего кода.

Теперь давайте пройдемся по неблокирующему I/O. I/O расшифровывается как Input/Output. Неблокирующий ввод-вывод, также известный как асинхронное программирование, означает, что ваш код не должен выполняться последовательно. Вы можете запускать несколько фрагментов своего кода одновременно, и хотя это удивительно и очень полезно, это также может привести к падению, поэтому вы должны кодировать с учетом этого. Помните, что какой-то код может выполняться раньше других. Не волнуйтесь, если вы не знаете, что означает асинхронный код, мы рассмотрим его на следующем уроке.

NodeJS можно использовать не только для API, мы будем использовать его с Express для создания наших конечных точек/маршрутов.

Что такое асинхронное программирование? [Теория]

Давайте представим, что мы в классе, и учитель собирается представить домашнее задание на неделю. У нее есть только одна его копия, поэтому она передает бумагу по кругу, и каждый ученик по очереди читает бумагу, и только когда один ученик заканчивает чтение бумаги, ее может читать следующий. Так работает синхронное программирование: пока не будет выполнен один процесс кода, следующий не запустится. Но, скажем, сейчас учитель размещает домашнее задание на проекторе. Теперь несколько студентов могут читать его одновременно! Вот как работает асинхронное программирование, теперь несколько процессов (они же студенты) могут быть запущены одновременно (они же могут читать одновременно). Хотя асинхронное программирование кажется лучшим вариантом, оно имеет некоторые недостатки. Это непросто программировать, и вы часто попадаете в ад обратных вызовов.

код

Давайте рассмотрим этот пример кода, если вы хотите протестировать его самостоятельно, все, что вам нужно, это установленный узел, тогда вам нужно перейти в папку (или каталог), где хранится файл, и запустить его с помощью

node filename.js

Если вы не установили узел, просто подождите, пока не появится раздел настройки проекта, где мы рассмотрим установку и настройку узла. Файл тоже оставлю во вложении. Давайте запустим скрипт и просмотрим результаты.

1: start App took 0 sec...to finish
 
3: End App took 0.003 sec...to finish
 
2: setTimeout took 1.003 sec...to finish

Итак, сразу видно, что порядок выполнения был 1, 3, 2.

В JavaScript setTimeout — это асинхронная задача. Даже если он вызывается с 0-секундным таймером, поскольку setTimeout является асинхронным, другой код будет выполняться в то же время.

В первом примере setTimeout вызывался до последнего console.log, но последний console.log (#3) выполнялся до console.log в пределах установленного времени ожидания (#2). Поскольку setTimeout является асинхронным, программа не ждала завершения setTimeout, она просто перешла к другому коду, а затем выполнила settimeout по истечении времени таймера.

Введение в конечные точки и C.R.U.D.

Что такое конечные точки? [теория]

Вскоре мы создадим API с некоторыми конечными точками, но перед этим нам нужно пройтись по конечным точкам. Конечная точка — это точка связи. Когда другое приложение активирует конечную точку, оно открывает канал связи с вашим сервером. Например, если мы перейдем к конечной точке GET Ice creams, она увидит, что мы хотим получить все мороженое в базе данных, и вернет нам все мороженое, когда закончит их получение. Конечные точки имеют разные типы/методы, и основные из них подпадают под слово C.R.U.D. В следующей лекции мы рассмотрим, что означает C.R.U.D.

Что такое CRUD? [теория]

C.R.U.D означает Создать, Чтение, Обновить и Удалить. Это 4 основных метода, которые мы используем в API. Когда мы хотим вставить данные в базу данных, мы используем конечную точку/маршрут POST. В нашем примере с мороженым маршрут POST будет использоваться для добавления вкусов мороженого в базу данных.

Когда мы хотим выбрать вариант из базы данных, мы используем конечную точку GET для получения информации. Маршрут GET никогда, никогда, никогда не изменит что-либо в базе данных, его единственная цель — получить информацию и вернуться к клиенту, который активировал эту конечную точку. Получение цены на ванильное мороженое будет выполняться с использованием маршрута GET. Когда мы хотим обновить данные в базе данных, мы используем PUT или POST. Обновление данных может заключаться в обновлении цены на шарик ванильного мороженого. Когда мы хотим удалить элемент из базы данных, мы используем маршрут DELETE. Удаление мороженого из базы данных выполняется с помощью удаленияконечной точки. Это 4 основных метода создания API.

Настройка проекта.

Установка узла.

Mac =› https://www.webucator.com/how-to/how-install-nodejs-on-mac.cfm

Linux =› https://www.ostechnix.com/install-node-js-linux/

Windows =› https://www.guru99.com/download-install-node-js.html

ССЫЛКА на скачивание узла =› https://nodejs.org/en/download/

Для этого проекта нам понадобится несколько вещей, но для установки чего-либо нам понадобится диспетчер пакетов Node, также известный как NPM, который поставляется с Node. Я связал пару быстрых статей по установке node. Чтобы проверить, работает ли узел, откройте терминал или командную строку и попробуйте запустить:

node -v

Он должен вернуть версию вашего узла.

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

npm -v

Настройка IDE или текстового редактора.

На рынке есть много, много, много IDE и текстовых редакторов, которые можно попробовать, некоторые платные, некоторые бесплатные. По моему опыту после длительного использования более 10 из них, я могу сказать, что больше всего мне нравится Visual Studio Code [https://code.visualstudio.com/].

Но на самом деле не имеет значения, что вы решите использовать.

После того, как вы настроите IDE или текстовые редакторы, вы можете перейти к следующему уроку.

Создание папки и файлов проекта.

Шаблон прикреплен в папке.

Это настройка приложения, чтобы помочь вам сосредоточиться на коде, а не на настройке. Я прикрепил шаблон, и вы можете настроить все самостоятельно, когда я пройдусь по шаблону.

Использование NPM.

Прежде чем мы перейдем к server.js, нам нужно убедиться, что у нас установлены все зависимости, но мы также хотим сохранить используемые нами зависимости, чтобы, если мы их потеряем, мы могли просто переустановить их из списка. Итак, мы настроим package.json, в котором будет храниться вся конфигурация нашего приложения. Итак, сначала давайте создадим этот файл с помощью NPM, именно так вы всегда должны создавать свой package.json.

В консоли или терминале запустите

npm init

Затем ответьте на вопросы соответственно, вы также можете просто запустить

npm init -y

И он автоматически ответит на вопросы для вас.

Как только ваш package.json будет создан, мы можем начать установку зависимостей и отслеживать, какие из них мы используем. Если вы хотите увидеть, как добавляются зависимости, убедитесь, что файл package.json открыт рядом с вашим терминалом/консолью, чтобы вы могли видеть его обновление в реальном времени. Мы собираемся запустить команду установки npm, но добавим к ней пару вещей, вот основная структура. В конце мы добавляем ` — save`, чтобы указать npm сохранить список зависимостей в наш package.json.

npm install [packages] --save

Вы также можете сделать `npm i`, чтобы еще больше сократить его.

Теперь давайте просто добавим все необходимые нам зависимости.

npm i express body-parser  --save

Иногда появляются предупреждения, обычно не о чем беспокоиться, важнее проверить ваш package.json и посмотреть, были ли добавлены зависимости. Вот как должен выглядеть объект зависимостей (внутри объекта package.json).

"dependencies": {
    "body-parser": "^1.18.3",
    "ejs": "^2.6.1",
    "express": "^4.16.4"
  }

Если вы проверите свой каталог, там есть папка с именем node modules и файл с именем package.lock, который мы добавили. Node_modules содержит код, импортированный из зависимостей. Важно не перемещать и не удалять их. Если вы удалите свои node_modules, просто снова запустите `npm i` в консоли, и он переустановит зависимости из нашего списка.

Переход к шаблону.

Давайте построчно пройдемся по файлу server.js, и я объясню, для чего все это нужно. Первые 3 строки — это настройка приложения.

Всякий раз, когда мы используем зависимости, нам нужно импортировать их в файл, где мы будем их использовать.

Итак, мы импортируем экспресс и сразу же запускаем его в переменной с именем `app`, а затем сразу после того, как импортируем body-parser. Body-parser является частью промежуточного программного обеспечения, которое считывает входные данные формы (поступающие из внешнего интерфейса) и сохраняет их как объект json, доступный через request.body.

Тогда нам просто нужно настроить 2 пресета для body-parser. Мы хотим преобразовать наши данные в json, и нам нужно настроить body-parser, чтобы он выполнял свою работу по разбору данных формы. Вот как это выглядит.

После этого у нас есть небольшой объект, где я храню данные, поскольку этот курс предназначен для конечных точек, а не для базы данных sql, поддельной базы данных будет достаточно. В эту поддельную_базу данных мы будем вставлять, считывать, изменять и удалятьданные. .

Затем у нас есть наша первая конечная точка, это наша конечная точка по умолчанию, я собираюсь добавить ее в отдельный урок, так что давайте пока продолжим.

Внизу у нас всегда есть app.listen, который сообщает нашему приложению, на каком порту мы хотим, чтобы оно запускалось/прослушивало события. При каждом запуске сервера первое сообщение в консоли будет говорить.

"Server is running on port   3000"

Настройка индексного маршрута.

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

const express = require("express");
const app = express();

После вызова переменной app нам нужно определить тип маршрута, в этом случае индексный маршрут всегда будет GET. После типа действия открываем скобку и начинаем вставлять параметры. Первый параметр — это местоположение маршрута, поэтому индексный маршрут будет

https://www.website.com/

Вот пример маршрута «/users/:id».

https://www.website.com/users/1

Затем нужно добавить обратный вызов, который будет запущен после активации конечной точки и будет содержать 2 параметра. Сначала переменная запроса, а другая — ответ. Оба содержат методы и данные, относящиеся к их задачам. В следующей строке мы используем метод Json из переменной ответа.

Вот как мы возвращаем fake_database как объект json тому, кто вызывает конечную точку.

response.json(fake_database);

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

Создание мини-сервера.

Планирование сервера.

Всякий раз, когда вы создаете что-то вроде API с конечными точками, важно заранее продумать наши функции. Давайте сохраним тему пользовательской базы данных из поддельной базы данных для этого API. Итак, мы можем сделать небольшое резюме для приложения.

Обзор. Этот API будет хранить имена и возраст пользователей, а также будет иметь все необходимые конечные точки для изменения фальшивой базы данных. эм>

Затем мы должны сделать несколько пользовательских историй:

  • Пользователи могут быть добавлены (POST) в поддельную базу данных.
  • Пользователей можно выбирать (GET) из поддельной базы, они выбираются по id.
  • Имена пользователей могут быть обновлены (PUT) из поддельной базы данных, они обновляются по идентификатору.
  • Пользователи могут быть удалены (DELETE) из фейковой базы, они удаляются по id.

Создание конечной точки POST/Create.

Итак, наша первая пользовательская история заключалась в том, чтобы иметь возможность добавлять пользователей в fake_database. Если вы не знакомы с http-запросами, я бы порекомендовал прочитать об этом подробнее, но мы будем получать пользовательский объект при активации конечной точки, и, поскольку это POSTзапрос, пользовательский объект будет внутри request.body.

Как только мы получим эти новые пользовательские данные, мы сможем добавить их в базу данных, давайте запишем это в псевдокоде.

// grab user data from request.body
// make a new user object to make sure we only grab relevant information
// add user object to the fake_database

Я рекомендую вам воспользоваться этим пустым почтовым маршрутом и попробовать написать код самостоятельно.

app.post('/user/new/', (request, response) => {
// code goes here
});

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

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

Чтобы проверить это, мы будем использовать postman, он очень прост и удобен в использовании. После того, как вы загрузите почтальона, выберите свое действие, поэтому мы выберем POST, затем введите свой URL-адрес, который для нас

localhost:3000/user/new/

Затем прямо под URL перейдите в раздел body и введите имя и возраст. Вот как это все должно выглядеть.

Примечание: вы должны установить его для x-www-form-urlencoded, иначе строки будут нуждаться в кавычках.

После того, как все заполнено, запустите сервер в терминале/консоли, используя:

node server.js

(если это не работает, убедитесь, что вы находитесь в правильном каталоге/папке)

Теперь отправьте запрос POST от почтальона и посмотрите, как ваш объект появляется в консоли/терминале следующим образом:

{ name: ‘“tom”’, age: ‘24’, id: 3 }

Теперь, когда мы знаем, что наш пост работает, давайте просто добавим код, который добавит нашего нового пользователя в fake_database. Вот как должна выглядеть конечная точка. (удалить console.log и успешно ответить)

Создание конечной точки GET/read.

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

‘/user/:id’ <== we want to get the `:id`

Нам нужно получить «id» из request.params. Вот пустой маршрут, предлагаю попробовать сделать конечную точку самостоятельно.

app.get('/user/:id', (запрос, ответ) => {

const { id } = request.params;
// code goes here
});

Вот некоторый псевдокод в помощь.

// grab id from parameters (done)
 // use id to search object
 // filter out user(object) that matches id
// return searched user through the response json method

Вот как выглядит полный маршрут:

Используя метод фильтра, мы можем отфильтровать пользователей, которые соответствуют идентификатору из параметров.

Затем мы отправляем отфильтрованный объект через метод ответа json. Теперь давайте запустим приложение, используя

node server.js

Затем в chrome или postman (убедитесь, что вы изменили действие на GET) перейдите к

http://localhost:3000/user/1

И данные json должны появиться.

Примечание: если вы используете chrome, вы можете получить инструмент chrome для анализа вашего json и его красивого форматирования, вот ссылка [chrome://extensions/] и просто выполните поиск json formatter.

Это все для маршрута GET, далее идет маршрут PUT (обновление).

Создание конечной точки PUT/Update.

Третья пользовательская история должна была иметь возможность обновлять информацию о пользователях. Пусть псевдокодирует задачу.

// grab the id and new name from the request params.
 // search database for user with matching id 
 // if user matches id, change name with new name

Вот пустой маршрут, я рекомендую вам попробовать его, прежде чем прокручивать вниз.

app.put(‘/user/update/name/’, (request, response) => { 
 // code goes here
 });

Вот как выглядит полный маршрут:

Создание конечной точки DELETE.

Последняя пользовательская история должна была иметь возможность удалять информацию о пользователях. Пусть псевдокодирует задачу.

// grab the id from the request body.
 // search database for user with matching id 
 // if user matches id, delete user.

Вот пустой маршрут, я рекомендую вам попробовать его, прежде чем прокручивать вниз.

app.delete(‘/user/delete/:id’, (request, response) => {
// code goes here
});

Вот как выглядит полный маршрут:

Обзор API.

полный код

Проверка всех конечных точек.

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

Для C в CRUD у нас есть маршрут POST для добавления нового пользователя:

[ localhost:3000/user/new/ ]

Для R в CRUD у нас есть маршрут GET для получения пользователя:

[ localhost:3000/user/:id ]

Для U в CRUD у нас есть PUTмаршрут для обновления информации о пользователе:

[ localhost:3000/user/update/name/ ]

Для D в CRUD у нас есть DELETEмаршрут для удаления пользователя:

[ localhost:3000/user/delete/:id ]

И, наконец, у нас есть индексный маршрут по умолчанию для возврата всей поддельной базы данных:

[ localhost:3000/ ]

и теперь у нас есть полнофункциональный API!

Удачного кодирования!