Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Вивчайте Налаштування Застосунку Express.js | Розробка Веб-Застосунків з Express.js
Розробка бекенду з Node.js та Express.js

bookНалаштування Застосунку Express.js

Створення першого бекенд-додатку з Express.js. Готові розпочати?

Встановлення Express.js

Створіть новий каталог для додатку та відкрийте цю папку у редакторі коду. Ми готові починати. У терміналі виконайте цю команду:

npm install express

Це схоже на замовлення Express.js у віртуальному магазині додатків, а npm — це наша служба доставки.

У результаті ми отримаємо таку файлову структуру додатку:

Базова структура проєкту:

  • node_modules – Містить встановлені пакети;
  • package.json та package-lock.json – Містять перелік залежностей і скриптів проєкту;
  • app.js або index.js – Точка входу для застосунку Express. Створюється вручну.

🏗️ Створення першого застосунку Express

Створення простого веб-сервера з використанням Node.js та фреймворку Express.js. Виконайте наступні кроки:

Крок 1: Імпорт Express

Як бібліотеку спочатку потрібно імпортувати її у файл:

const express = require('express');

Крок 2: Створення екземпляра додатку Express

Створюється екземпляр додатку Express. Змінна app використовується для налаштування та визначення поведінки веб-сервера.

const app = express();

Крок 3: Встановлення порту

Визначається номер порту, на якому сервер буде очікувати підключення. У цьому випадку встановлено 3000, але можна обрати будь-який доступний номер порту.

const port = 3000;

Крок 4: Визначення маршруту

Налаштовується маршрут для обробки HTTP GET-запитів до кореневої URL-адреси (/). Коли клієнт (зазвичай веб-браузер) звертається до кореневої адреси сервера, у відповідь надсилається Hello, World!.

app.get('/', (req, res) => {
  res.send('Hello, World!');
});
  • app.get('/') — Визначає маршрут для обробки GET-запитів до кореневого шляху (/). Можна визначати маршрути для різних HTTP-методів (GET, POST, PUT, DELETE тощо);
  • (req, res) => { ... } — Колбек-функція, яка виконується, коли клієнт надсилає GET-запит до вказаного маршруту. Приймає два аргументи: req (об'єкт запиту) та res (об'єкт відповіді). У цьому випадку надсилає текст Hello, World! як відповідь.

Крок 5: Запуск сервера

Запустіть сервер і налаштуйте його на прослуховування вказаного порту (у нашому випадку, порт 3000). Після успішного запуску сервер виведе повідомлення в консоль із зазначенням порту, на якому він працює.

app.listen(port, () => {
  console.log(`Server is running on port ${port}`);
});

app.listen(port, ...) — цей метод запускає сервер і прослуховує вказаний порт. Другий аргумент — це функція зворотного виклику, яка виконується після запуску сервера.

Крок 6: Запуск додатку

Запустіть додаток у терміналі за допомогою команди node.

node index

🌐 Після запуску скрипта

Сервер буде працювати, і ви зможете отримати до нього доступ, відкривши веб-браузер і перейшовши за адресою http://localhost:3000. У браузері має відобразитися Hello, World!.

Все було зрозуміло?

Як ми можемо покращити це?

Дякуємо за ваш відгук!

Секція 3. Розділ 4

Запитати АІ

expand

Запитати АІ

ChatGPT

Запитайте про що завгодно або спробуйте одне із запропонованих запитань, щоб почати наш чат

Awesome!

Completion rate improved to 2.56

bookНалаштування Застосунку Express.js

Свайпніть щоб показати меню

Створення першого бекенд-додатку з Express.js. Готові розпочати?

Встановлення Express.js

Створіть новий каталог для додатку та відкрийте цю папку у редакторі коду. Ми готові починати. У терміналі виконайте цю команду:

npm install express

Це схоже на замовлення Express.js у віртуальному магазині додатків, а npm — це наша служба доставки.

У результаті ми отримаємо таку файлову структуру додатку:

Базова структура проєкту:

  • node_modules – Містить встановлені пакети;
  • package.json та package-lock.json – Містять перелік залежностей і скриптів проєкту;
  • app.js або index.js – Точка входу для застосунку Express. Створюється вручну.

🏗️ Створення першого застосунку Express

Створення простого веб-сервера з використанням Node.js та фреймворку Express.js. Виконайте наступні кроки:

Крок 1: Імпорт Express

Як бібліотеку спочатку потрібно імпортувати її у файл:

const express = require('express');

Крок 2: Створення екземпляра додатку Express

Створюється екземпляр додатку Express. Змінна app використовується для налаштування та визначення поведінки веб-сервера.

const app = express();

Крок 3: Встановлення порту

Визначається номер порту, на якому сервер буде очікувати підключення. У цьому випадку встановлено 3000, але можна обрати будь-який доступний номер порту.

const port = 3000;

Крок 4: Визначення маршруту

Налаштовується маршрут для обробки HTTP GET-запитів до кореневої URL-адреси (/). Коли клієнт (зазвичай веб-браузер) звертається до кореневої адреси сервера, у відповідь надсилається Hello, World!.

app.get('/', (req, res) => {
  res.send('Hello, World!');
});
  • app.get('/') — Визначає маршрут для обробки GET-запитів до кореневого шляху (/). Можна визначати маршрути для різних HTTP-методів (GET, POST, PUT, DELETE тощо);
  • (req, res) => { ... } — Колбек-функція, яка виконується, коли клієнт надсилає GET-запит до вказаного маршруту. Приймає два аргументи: req (об'єкт запиту) та res (об'єкт відповіді). У цьому випадку надсилає текст Hello, World! як відповідь.

Крок 5: Запуск сервера

Запустіть сервер і налаштуйте його на прослуховування вказаного порту (у нашому випадку, порт 3000). Після успішного запуску сервер виведе повідомлення в консоль із зазначенням порту, на якому він працює.

app.listen(port, () => {
  console.log(`Server is running on port ${port}`);
});

app.listen(port, ...) — цей метод запускає сервер і прослуховує вказаний порт. Другий аргумент — це функція зворотного виклику, яка виконується після запуску сервера.

Крок 6: Запуск додатку

Запустіть додаток у терміналі за допомогою команди node.

node index

🌐 Після запуску скрипта

Сервер буде працювати, і ви зможете отримати до нього доступ, відкривши веб-браузер і перейшовши за адресою http://localhost:3000. У браузері має відобразитися Hello, World!.

Все було зрозуміло?

Як ми можемо покращити це?

Дякуємо за ваш відгук!

Секція 3. Розділ 4
some-alt