Разработка веб приложений. #2 - Backend, Express.

Первая статья — здесь.

Для начала — большое спасибо всем за то что приняли мою первую статью, было приятно. Ну а теперь вторая… :)

Frontend разработка штука конечно занятная и очень интересная, да и платят вкусно. Однако чем были хороши WP и MODx, так это готовой backend частью, на базе которой можно было на коленке собрать сайт почти любого типа. Мне очень не хотелось возвращаться к использованию CMS (про CMS будет в одной из следующих статей) и я решил внимательно изучить тренды backend индустрии для веб-приложений.

Т.к. я сменил PHP на JS, прыгать обратно на PHP оказалось больно. Причем факапился на обычном синтаксисе, наверное дело привычки, но неудобно. Тропинка в итоге привела меня к Node.js.

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

Почему JS и Node?
Для начала отвечу на свой же вопрос, почему нода, почему JS? Нам разработчикам (не важно фронт или бек), крайне важно следить за трендами. Конечно если вы постоянно в теме разработки, общаетесь с коллегами, читаете статьи или ездите/смотрите на всякие митапы, то так или иначе вы будете в курсе тенденций нашей индустрии.

Но для меня в меру моей неопытности в беке, было все не так очевидно. И я начал исследовать. Для начала скажу — что выбор у меня был не особо большой, либо все таки PHP, либо JS. Почему так? Да очень просто, оба этих языка я в той или иной мере уже знал и на работе / фрилансе мне нужно было решать задачи и зарабатывать деньги. Начинать изучать что-то с нуля конечно круто (говорят даже важно практиковать как можно больше языков программирования), но деньги были важным критерием.

Для начала по JS. За последние несколько лет, этот язык очень очень и очень сильно подтянули, причем подтянули настолько сильно, что многие современные браузеры за ним не поспевают. Отсюда например у babel еженедельно 36 миллионов скачиваний на NPM…

Давайте посмотрим на статистику популярности языков программирования.

* 2019
* 2020
* 2021

Занятно да? Хочу отметить рост TypeScript, т.к. о нем я напишу в следующей статье. Что касается JS — ничего удивительного, это по сути единственный клиентский язык программирования, которым мы все чудно нагружаем браузеры пользователей. :) Но все таки главенство JS является довольно важным фактором.

Теперь посмотрим что там по ноде.

* 2019
* 2020
* 2021

Тут крайне важно обратить внимание, что стековерфлоу переместили ноду из раздела фреймворки и библиотеки, в раздел языков программирования. Решение очень спорное, ведь нода это не язык программирования. Ну да ладно, из-за смены категории, нода очевидно потеряла лидерство и свой процент, однако даже в новой и очень конкурентной категории, утерла нос тому же PHP, Golang, Ruby и т.д.

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

И вот начитавшись статей, насмотревшись статистик и посмотрев некоторое количество интервью и выступлений на ютуб, я пошел на HH. Сравнил количество вакансий и если грубо, то у PHP в 2 раза больше вакансий чем у ноды. Примерно такое я и ожидал на самом деле, всякие WP и битриксы никуда не делись, а вот в среднем 1000 вакансий по ноде меня приятно удивили.

Решил изучать серверный JS!

Обучение
Ну конечно я очень быстро пришел к express. Наверное многие из вас слышали про него, фреймворк на ноде для веб-разработки. Принял решение изучать его. Почему? Ну потому что как бы самый популярный и для входа в мир ноды довольно простой.

Однако прежде чем использовать фреймворк, я решил приобрести на юдеми курс по ноде и экспрессу, в котором преподователь показывает на простом примере как на ноде написать свой сайт с SSR за пару часов. Если что — вот тут весь код сайта. Невероятно мало кода, а бек и шаблонизация уже готовы, магия…

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

Express.js
Прежде чем начинать что-то делать на экспрессе, я объясню что я вообще хотел от бека. Ну конечно для начала — управление контентом сайта, а для этого в написанную мной на Vue админку надо как-то попасть, отсюда у меня родилась идея сделать модуль для сотрудников сайта (не путать с обычными юзерами).

За идею я взял архитектуру пользователей в MODx, доработал ее и принялся писать этот модуль на Express.js. Вот так например выглядит моя первая версия модуля авторизации для сотрудников, которую я написал вначале 2020 года:

async login({ body: { email, password } }, res) {
    try {
      if (validator.isEmpty(email)) {
        return res.status(422).send(
          {
            field: 'email',
            type: 'isEmpty',
            message: 'Email is empty.',
          },
        );
      }

      if (!validator.isLength(email, { min: 4, max: undefined })) {
        return res.status(422).send(
          {
            field: 'email',
            type: 'isLength',
            message: '4 characters minimum.',
          },
        );
      }

      if (!validator.isEmail(email)) {
        return res.status(422).send(
          {
            field: 'email',
            type: 'isEmail',
            message: 'This is not an email.',
          },
        );
      }

      if (validator.isEmpty(password)) {
        return res.status(422).send(
          {
            field: 'password',
            type: 'isEmpty',
            message: 'Password is empty.',
          },
        );
      }

      const normalizedEmail = validator.normalizeEmail(email);

      // Trying to login
      const staff = await Staff.findOne({ email: normalizedEmail });

      if (!staff) {
        return res.status(403).send({ message: 'Login or password in incorrect.' });
      }

      const isPasswordCorrect = bcrypt.compareSync(password, staff.password);

      if (!isPasswordCorrect) {
        return res.status(403).send({ message: 'Login or password in incorrect.' });
      }

      const accessToken = jwt.sign({
        userId: staff._id,
        email: staff.email,
      }, process.env.JWT_SECRET, { expiresIn: '5m' });

      const refreshToken = jwt.sign({
        userId: staff._id,
        email: staff.email,
      }, process.env.JWT_SECRET_REFRESH, { expiresIn: '5d' });

      const foundToken = await StaffToken.findOne({ staff: staff._id });

      if (foundToken) {
        await StaffToken.findByIdAndUpdate(foundToken._id, { token: refreshToken });
        return res.status(200).send({
          accessToken,
          refreshToken,
          id: staff._id,
          user: staff.email,
        });
      }

      const token = new StaffToken({ token: refreshToken, staff: staff._id });
      await token.save();

      return res.status(200).send({
        accessToken,
        refreshToken,
        id: staff._id,
        user: staff.email,
      });
    } catch (err) {
      return res.status(500).send({ message: 'Internal server error.' });
    }
  },

Сегодня (да и собственно вчера) это называется анти-паттерн. Так делать сегодня — это не правильно. Но полтора года назад я об этом не особо-то и знал. Я тут считай только только вник в Event Loop и осознал что такое однопоточность… Короче мой модуль был написан и готов, готовы были и endpoints которые я с радостью применил в своей админке на Vue.

И о чудо, за чуть более чем 2 недели, тратя по 2-3 часа в день, я написал свой первый модуль на express, сумел авторизоваться в админке, умел создавать, редактировать и удалять пользователей. А так же чуть позже дополнил модуль системой ролей и пермишенов.

Как видно по коду выше, авторизация работает на JWT, даже рефреш токен сделал. Но самое главное, это то, что мне безумно сильно понравилось писать модули на express. Даже в рамках моего маленького опыта и не очень красивого кода, это было приятно и очень интересно.

Мой стек на момент написания кода выше:

* Git
* Docker
* Express
* Mongo
* Vue 2 (dashboard)
* Nuxt 2 (frontend)

Вот таким вот образом, я начал свой путь в мире backend разработки на ноде, работая при этом на основной работе фулл-тайм на frontend части.

Разочарование
У меня в контактах не было ни одного знакомого, который мог бы мне хотя бы немного помочь в освоении нового инструмента, даже за вознаграждение. И это очень сильно прокачивает! Конечно есть чаты, но не всегда там тебе могут помочь, особенно когда проблему не объяснить в двух словах.

Мой backend разрастался модулями и в какой-то момент я заподозрил что-то странное. Мне вдруг начало становиться все сложнее и сложнее работать с моим проектом. Архитектура MVC которая зачастую используется в express начала показывать свою неидеальность (именно по этой причине кстати, серьезные дядьки на express уже давно использует другие архитектурные паттерны). Пытаясь разобраться почему так, я узнал что есть такой фреймворк как Nest.js.

Пробежавшись по нему я ужаснулся, TypeScript, OOP, DI и многое многое другое. Посмотрев на свой backend и узнав что я использую анти-паттерн, глубого вздохнув, я отсрочил реализацию моих модулей и решил (пока это не так больно), переходить к изучению Nest и TS.

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

npm run dev