JavaRush /Курсы /Модуль 4: Node.js, Next.js и Angular /Установка Express.js, структура приложения

Установка Express.js, структура приложения

Модуль 4: Node.js, Next.js и Angular
5 уровень , 0 лекция
Открыта

1. Что такое Express.js и зачем он нужен

Express.js — это самый популярный фреймворк для создания серверных приложений на Node.js. Его любят за простоту, гибкость и огромное сообщество. Если вы когда-нибудь писали сервер на чистом Node.js, вы наверняка сталкивались с тем, как много ручной работы требуется: разбирать URL, парсить тело запроса, расставлять заголовки, обрабатывать ошибки. Express.js берёт эти заботы на себя и позволяет вам сосредоточиться на бизнес-логике.

Почему Express.js?

  • Минимализм: не навязывает архитектуру, но даёт удобные инструменты.
  • Расширяемость: тысячи готовых middleware и модулей.
  • Простота: низкий порог входа, лаконичный API.
  • Гибкость: подходит и для маленьких API, и для крупных приложений.

Если сравнивать с модулем http, Express — как электросамокат против самодельного самоката из подшипников: оба едут, но первый — быстрее, удобнее и с фарами.

2. Установка Express.js

Подготовка проекта

Для начала создадим новую папку для нашего первого Express-приложения. Откройте терминал и выполните:

mkdir express-demo
cd express-demo

Теперь инициализируем новый Node.js-проект (если вы не сделали этого раньше):

npm init -y

Этот шаг создаст файл package.json с настройками проекта. Если вы не помните, что это такое — не страшно, мы уже обсуждали это ранее, а детали можно посмотреть в лекциях про npm.

Установка Express

Теперь установим сам Express.js с помощью npm:

npm install express

После этой команды в папке появится папка node_modules и файл package-lock.json. Если у вас есть привычка удалять всё незнакомое — не спешите! Эти файлы нужны для работы зависимостей.

В package.json появится запись о том, что ваш проект теперь зависит от express.

Проверяем установку

Чтобы убедиться, что всё прошло успешно, можно выполнить:

npm list express

Вы увидите нечто вроде:

express-demo@1.0.0
└── express@4.18.2

Если вы видите версию express — поздравляю, всё готово! Если npm ругается, перепроверьте, что вы находитесь в нужной папке и что у вас есть интернет.

3. Структура простого Express-приложения

Давайте посмотрим, как выглядит минимальное приложение на Express. Создайте файл index.js в корне вашего проекта:

// index.js
const express = require('express'); // Импортируем express

const app = express(); // Создаём экземпляр приложения

app.get('/', (req, res) => {
  res.send('Hello, Express!');
});

app.listen(3000, () => {
  console.log('Сервер запущен на http://localhost:3000');
});

Что здесь происходит?

  • Мы импортируем express.
  • Создаём приложение (app).
  • Описываем маршрут на адрес / (корень сайта), который отвечает "Hello, Express!".
  • Запускаем сервер на порту 3000.

Запуск приложения

В терминале выполните:

node index.js

Если всё хорошо, увидите сообщение:

Сервер запущен на http://localhost:3000

Откройте браузер и перейдите по адресу http://localhost:3000 — вы увидите надпись "Hello, Express!".

4. Разбираем структуру Express-проекта

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

Минимальный проект

express-demo/
├── node_modules/
├── package.json
└── index.js

Рекомендованная структура для реальных проектов

express-demo/
├── node_modules/
├── package.json
├── index.js
├── routes/
│   └── main.js
├── controllers/
│   └── homeController.js
├── public/
│   └── style.css
├── views/
│   └── index.html

Пояснения:

  • index.js — точка входа, где запускается приложение.
  • routes/ — папка для маршрутов (пути, по которым можно обращаться к серверу).
  • controllers/ — логика обработки запросов (необязательно на старте, но удобно).
  • public/ — статические файлы (CSS, картинки, JS для фронтенда).
  • views/ — шаблоны для генерации HTML (если вы делаете серверный рендеринг).

Факт для любопытных: Express не заставляет использовать контроллеры и шаблоны. Вы можете сделать API без views и public, если пишете только backend.

5. Пример расширения приложения

Давайте научимся добавлять новые маршруты. Например, добавим страницу "О нас":

// index.js
const express = require('express');
const app = express();

app.get('/', (req, res) => {
  res.send('Hello, Express!');
});

app.get('/about', (req, res) => {
  res.send('Это страница О нас!');
});

app.listen(3000, () => {
  console.log('Сервер запущен на http://localhost:3000');
});

Теперь, если вы откроете http://localhost:3000/about, увидите новую страницу.

6. Как Express облегчает жизнь

Вспомним, как мы писали сервер на чистом Node.js:

const http = require('http');

const server = http.createServer((req, res) => {
  if (req.url === '/' && req.method === 'GET') {
    res.writeHead(200, {'Content-Type': 'text/plain'});
    res.end('Hello, Node!');
  } else {
    res.writeHead(404, {'Content-Type': 'text/plain'});
    res.end('Not found');
  }
});

server.listen(3000);
  • Много ручной работы с заголовками, методами, путями.
  • Нужно самому парсить тело запроса, параметры, обработку ошибок.

Express всё это делает за вас:

  • Лаконичный синтаксис для маршрутов (app.get, app.post и т.д.).
  • Автоматическая расстановка заголовков.
  • Простая обработка ошибок.
  • Подключение middleware (например, для логирования, парсинга JSON, авторизации).
  • Лёгкая работа со статикой и шаблонами.

7. Типичные ошибки при установке и запуске Express.js

Ошибка №1: "Cannot find module 'express'"
Это значит, что Express не установлен или вы запустили скрипт не из той папки. Проверьте, что вы выполнили npm install express и находитесь в корне проекта.

Ошибка №2: "EADDRINUSE: address already in use"
Порт 3000 уже занят — возможно, вы запустили сервер дважды или другой процесс его использует. Попробуйте изменить порт на 3001 или завершить лишние процессы.

Ошибка №3: "SyntaxError: Unexpected token"
Это может быть опечатка в коде, лишняя или пропущенная скобка. Проверьте внимательно строки, которые вы меняли.

Ошибка №4: "Cannot GET /somepage"
Вы обратились по адресу, для которого не определён маршрут. Добавьте нужный маршрут через app.get('/somepage', ...).

Ошибка №5: Не видны статические файлы
Вы забыли добавить app.use(express.static('public')) или положили файл не в ту папку. Проверьте путь и имя папки.

1
Задача
Модуль 4: Node.js, Next.js и Angular, 5 уровень, 0 лекция
Недоступна
Инициализация проекта и установка Express.js
Инициализация проекта и установка Express.js
1
Задача
Модуль 4: Node.js, Next.js и Angular, 5 уровень, 0 лекция
Недоступна
Создание минимального Express-приложения
Создание минимального Express-приложения
Комментарии
ЧТОБЫ ПОСМОТРЕТЬ ВСЕ КОММЕНТАРИИ ИЛИ ОСТАВИТЬ КОММЕНТАРИЙ,
ПЕРЕЙДИТЕ В ПОЛНУЮ ВЕРСИЮ