Введение
У каждого в карьере программиста есть момент, когда он понимает, что в целом программирование ему нравится. У всех нас есть собственный заветный опыт создания отличных анекдотов в супер крутой социальной обстановке. Для меня одним из таких опытов было связывание моего внутреннего сервера (Ruby on rails 🚂 💎 👍) с моим внешним javascript-клиентом (📜 🖊 😊). Это была одна из самых приятных и самоутверждающих вещей, которые я когда-либо делал. Этот «Доктор. Франкенштейновский опыт был подобен электричеству! Я был вдохновлен, чтобы создавать больше, оптимизировать больше и добавлять больше функций! 😈
Сегодня в этом блоге я расскажу, как настроить сервер с ванильным Node.js. Я пройдусь по каждому шагу и объясню, как все работает. Надеемся, что этот внутренний подход поможет вам понять еще более сложные концепции и абстракции с использованием Node.js. Настройка сервера — это фундаментальный строительный блок, поэтому уделите время концепции — это действительно ключ к пониманию того, почему все работает. Это окупится в будущем, когда вы погрузитесь в выбор веб-фреймворка, такого как Express.js (популярный).
Давайте копать! 🕳 🐇 🦡
Установка Node.js
Link to Super Cool Node.js Blog 😎 🐪 🧊: https://ineedmoreplates.medium.com/learning-node-js-8288e0411957
Если вы не следите за всеми моими блогами. Я написал хороший блог + руководство по установке Node.js. Я настоятельно рекомендую вам прочитать его. Он более подробно объясняет Node.js. Вы получаете простое пошаговое руководство по установке Node.js (внизу).
Давайте поговорим о настройке:
In case you forget: User/Client(Browser): Think of what's on your Device. Example: "Safari", "Chrome","Mozilla", etc. URL: Think of this an encoded and human-readable address. Well all use it when typing in a web address on our browsers. Domain: an identification string that defines a realm of administrative autonomy, authority or control within the Internet. Request: The Domain sends a request to the server with an IP address belonging to that Domain. IP address: unique ID used to identify each device on a Domain(DNS). Server: Hardware, We will be writing our code for it.
Прежде чем мы начнем писать какой-либо код, давайте быстро рассмотрим, как работает веб-страница. Представьте, что пользователь вводит URL-адрес. Допустим, это что-то довольно обычное, например, погуглить видео о кошках 🐈 , почитать технический блог 🤓 , купить чугунную кастрюлю на Амазоне 🥘 ! Что происходит?
Да, это Мета, но выслушай меня. Это принесет дополнительное понимание с каждым нажатием клавиши. Легко запомнить шаблоны в кодировании, но мастерство заключается в понимании и передаче того, что, черт возьми, мы только что сделали?
Пользователь вводит URL-адрес веб-страницы:
- Пользователь переходит в браузер
- Пользователь вводит URL
- URL передается в домен
- Домен отправляет запрос на сервер (HTTP)
- Сервер получает запрос
- Если все проходит успешно, Сервер получает данные из Базы данных.
- Сервер возвращает ответ (страница HTTP)
Вау, там несколько шагов, потом понимаешь, да? Есть даже больше, когда мы говорим о входе в систему, файлах cookie, безопасности и т. д. Идея в том, что мы хотим получить здесь базовое понимание.
Поскольку Node.js является серверной средой выполнения, для Javascript наш код будет записываться на сам сервер (бэк-энд). В этом списке это будет шаг 5.
Судя по этому списку, мы можем рассчитывать на входящие запросы, исходящие ответы и некоторую связь с базой данных. Мы также знаем, что пользователю будет отправляться HTTP-страница.
Just a friend reminder: HTTP and HTTPS HTTP: Hyper Text Transfer Protocol, it's a Protocol or way of transfering Data which your Browser or Server can understand. HTTPS: 🔒 Hyper Text Tranfer Protocol Secure, It's HTTP + Data Encrpytion during Transmission. Way more secure, great for online banks, E-trading, etc. ! (look at the 🔒 icon next to your URL, that's HTTPS 😉 )
Давайте строить 🔨 🧰 🛠 :
Today I’m building with : 1. OS operating system(if not, just keep reading) 🍎 🐛 🍏 2. Vscode 🤓 🎹 🐭 3. Node.js 👩🔬 👨🔬 🧑🔬 4. Basic Understanding of Javascript 📜 🪶 😊
Предварительные шаги:
- Давайте начнем с создания новой папки в нашем файловом каталоге. Вы можете назвать это как угодно. Я предпочитаю что-то короткое и легко узнаваемое.
2. Давайте откроем наш редактор кода. Я наркоман Vscode. Не стесняйтесь использовать все, что вам нравится.
3. Давайте откроем терминал и перейдем к папке создания.
Шаг за шагом:
Теперь, когда мы все настроены. Давайте погрузимся в пошаговое кодирование в сочетании с некоторыми полезными пояснениями. Не бойтесь тестировать вещи самостоятельно. Это лучший способ понять, что все работает.
Шаг 1: давайте создадим файл с именем app.js. Здесь будет создан наш сервер.
Шаг 2: Мы будем импортировать встроенный модуль ядра, найденный в Node.js.
Looks like this: const http = require('http'); <-- This is a global scope *** require(), Node.js syntax for importing, it takes a string argument
Шаг 3: Модуль HTTP имеет хороший выбор методов. Будет использоваться метод .createServer().
Looks like this: const http = require('http') <-- import http.createServer(); <-- access method, JS style
Шаг 4: .createServer() — это специальная функция, которая принимает функцию в качестве аргумента. Эта функция должна принимать 2 аргумента в качестве ответа и запроса. Мы также можем назвать эту функцию и ее аргументы как угодно. Тем не менее, я большой поклонник синтаксиса стрелок + анонимных функций. Это стоит изучить, так как его легче читать и меньше писать код. Посмотрите мой пример ниже.
const http = require('http') http.createServer((req,res) => {}); <-- clean & easy to read res = response req = request
Шаг 5: .createServer(), как следует из названия, выводит сервер. Сохранит это в константную переменную, и наша функция вернет ответ.
const http = require('http') const server = http.createServer((req,res) => { console.log(res) <-- let's just console.log for now 😊 }); <-- clean & easy to read
Шаг 6: Давайте найдем порт 🚢 . Мы будем прослушивать нашу переменную сервера. Этот метод будет прослушивать адрес порта. Подставим стандартные 3000 в качестве аргумента. Также вернет console.log аргумента res.
const http = require('http') const server = http.createServer((req,res) => { console.log(res) <-- let's just console.log for now 😊 }); server.listen(3000); 🧚♀️ "Hello, hey!!!"
Шаг 7: В нашем терминале запустится наш файл с именем app.js. Ваш сервер должен разогнаться. Обратите внимание на мигающий курсор. Если вам нужно завершить работу, сервер использует сочетание клавиш «Ctrl + c» для завершения работы сервера.
Looks like this: node app.js <-- ctrl + c kills server!
Шаг 8: Давайте запустим наш сервер и откроем браузер. После этого вернемся к нашему терминалу и взглянем. Вы должны увидеть новую активность в своем терминале.
localhost: 3000 <-- type in URL field of your browser!
Заключение
Поздравляю! 🎊 Вы развернули свой первый Сервер на Node.js. Вы чувствуете эту вдохновляющую энергию! А теперь иди строй что-нибудь крутое! Сила среды выполнения javascript находится в вашем распоряжении. Если вам понравился этот блог, не бойтесь хлопнуть меня в ладоши. Всем удачного кодирования 😆 🎹 🐭!
Ссылки:
Great Course on Node.js: https://www.udemy.com/course/nodejs-the-complete-guide/ My Node.js: https://ineedmoreplates.medium.com/learning-node-js-8288e0411957 Require function: https://nodejs.org/en/knowledge/getting-started/what-is-require/ Create server method: https://www.w3schools.com/nodejs/met_http_createserver.asp Listen method: https://www.w3schools.com/nodejs/met_server_listen.asp