Node.JS *

Привет, друзья!

Данная серия статей представляет собой мои заметки о NestJS — фреймворке для разработки эффективных и масштабируемых серверных приложений на Node.js. NestJS использует прогрессивный (что означает текущую версию ECMAScript) JavaScript с полной поддержкой TypeScript (использование TypeScript является опциональным) и сочетает в себе элементы объектно-ориентированного, функционального и реактивного функционального программирования.

Под капотом Nest по умолчанию использует Express, но позволяет переключиться Fastify.

• Шпаргалка по Express API
• Карманная книга по TypeScript
• Шпаргалка по TypeScript

Первая статья представляет собой обзор основных возможностей, предоставляемых NestJS, во второй рассматриваются основы работы с этим фреймворком, в третьей — техники и рецепты по интеграции NestJS с некоторыми популярными библиотеками, используемыми при разработке приложений на Node.js, наконец, четвертая статья представляет собой туториал по разработке относительно полноценного React/Nest/TypeScript-приложения.

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

Это вторая часть руководства.

Вот ссылка на первую часть.

Добрый день. В нашей компании мы очень трепетно относимся к архитектуре наших решений и удобству ее использования. Мы стараемся убирать узкие места для получения лучшей производительности, а также для сокращения времени разработки новых фич. Одним из таких способов мы решили поделиться с вами. Сегодня поговорим о фронт-оптимизации, об express, nest.js и о том, как этим правильно пользоваться.

Привет, друзья!

В данном туториале мы разработаем простой сервер на NestJS, взаимодействующий с SQLite с помощью Prisma, с административной панелью, автоматически генерируемой с помощью AdminJS, и описанием интерфейса, автоматически генерируемым с помощью Swagger. Все это будет приготовлено под соусом TypeScript.

Репозиторий с кодом проекта.

Если вам это интересно, прошу под кат.

Привет, друзья!

В данном туториале мы разработаем простого бота для Telegram. Сначала зарегистрируем и кастомизируем бота с помощью BotFather, затем напишем для него сервер на Express, развернем сервер на Heroku и подключим бота к серверу с помощью веб-хука.

Функционал бота будет следующим:

• в ответ на сообщение joke возвращается программистская шутка, например: "Algorithm: a word used by programmers when they don't want to explain how their code works." (Алгоритм — это слово, используемое программистами, когда они не хотят объяснять, как работает их код));
• в ответ на сообщение, представляющее собой дату в формате ДД.ММ, возвращается либо список дел, запланированных на эту дату в таблице Google (массив объектов), либо фраза "You have nothing to do on this day.", если на эту дату не запланировано никаких дел;
• в ответ на любое другое сообщение возвращается фраза "I have nothing to say.".

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

• Репозиторий с кодом сервера для бота.
• Бот — @aio350_reminder_bot.

Если вам это интересно, прошу под кат.

Подборка того, что волновало фронтенд-разработку, пока все отдыхали на майских.

Горячее

Веб быстро развивается и уже пора переосмыслить подходы к адаптации интерфейсов. Используйте CSS-свойства, функции и значения: clamp(), min-content, max-content, fit-content, auto-fit, minmax().

Узнайте о JavaScript контейнерах.

Что случится если вы откажетесь от React?

Ещё один сайт на HTML. Да, так тоже можно.

Остальные новости и статьи — под катом.

Привет, друзья!

Вам когда-нибудь хотелось узнать, как работают сборщики модулей (module bundlers) JavaScript типа Webpack или Parcel, что называется, под капотом. Если хотелось, тогда эта статья для вас.

В данном туториале мы разработаем простой сборщик модулей на Node.js, который будет компилировать все модули приложения в один минифицированный файл с кодом, соответствующим стандарту ES5.

Источник вдохновения.

Репозиторий с кодом.

Привет, друзья!

В этой серии из 3 статей я расскажу вам о Nest (NestJS) — фреймворке для разработки эффективных и масштабируемых серверных приложений на Node.js. Данный фреймворк использует прогрессивный (что означает текущую версию ECMAScript) JavaScript с полной поддержкой TypeScript (использование TypeScript является опциональным) и сочетает в себе элементы объектно-ориентированного, функционального и реактивного функционального программирования.

Под капотом Nest использует Express (по умолчанию), но также позволяет использовать Fastify.

• Шпаргалка по Express API
• Карманная книга по TypeScript
• Шпаргалка по TypeScript

В первой статье рассматриваются основы работы с Nest, во второй — некоторые продвинутые возможности, предоставляемые этим фреймворком, в третьей — приводится пример разработки простого React/Nest/TypeScript-приложения.

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

Это первая часть руководства.

Привет, друзья!

Вам когда-нибудь хотелось узнать, как под капотом работают пакетные менеджеры (Package Manager, PM) — интерфейсы командной строки (Command Line Interface, CLI) для установки зависимостей проектов наподобие npm или yarn? Если хотелось, тогда эта статья для вас.

В данном туториале мы разработаем простой пакетный менеджер на Node.js и TypeScript. В качестве образца для подражания мы будем использовать yarn. Если вы не знакомы с TS, советую взглянуть на эту карманную книгу.

Наш CLI будет называться my-yarn. В качестве lock-файла (yarn.lock, package-lock.json) он будет использовать файл my-yarn.yml.

Источник вдохновения.

Код проекта.

Objection.js — минималистичная ORM-библиотека для Node.js, которая сильно упрощает взаимодействие с базами данных и не перегружена дополнительными функциями, как Sequelize или TypeORM. Разбираемся, в чем ее специфика и как строить запросы с ее помощью.

Недавно я увидел на StackOverflow историю разработчика, который столкнулся с проблемой использования ORM . Этот кейс натолкнул меня на мысль написать статью о альтернативе Sequelize — Objection.js, библиотеке, которая решает множество проблем ORM.

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

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

Привет, друзья!

В этой статье я продолжаю (и заканчиваю) делиться с вами заметками о Docker.

Заметки состоят из 4 частей: 2 теоретических и 2 практических.

Если быть более конкретным:

• первая часть посвящена Docker, Docker CLI и Dockerfile;
• во второй части рассказывается о Docker Compose;
• в третьей части мы разрабатываем приложение, состоящее из трех сервисов: клиента на React, админки на Vue и сервера на Express, и базы данных PostgreSQL, взаимодействие с которой осуществляется с помощью Prisma.

В этой заключительной части мы "контейнеризуем" наше приложение.

Репозиторий с кодом приложения.

Если вам это интересно, прошу под кат.

Как и всегда, участники сообщества усердно работают над добавлением новых функций в Node.js, перечисленных в виде pull requests на GitHub. Далее мы подробно расскажем о нескольких привлекательных дополнениях, которые ожидают нас уже очень скоро. А также обсудим, что интересного происходит в сообществе Node.js в начале 2022 года.

В Skyeng есть команда коммуникаций. Мы предоставляем инструменты для связи оператора с пользователем. Например, ученику плохо слышно преподавателя на уроке и он хочет связаться с поддержкой, чтобы решить проблему — мы помогаем. 

На старте было просто: связаться с нами можно было только через почту. Входящим ящиком был IMAP, исходящим — SaaS сервис по отправке почты, забрать письма с которого было то еще приключение. Мы смотрели на заголовки и соединяли письма в цепочки, как в любом почтовике: Gmail, Outlook. В таком виде передавали операторам. 

Но оказалось, что с теми метаданными, которые мы предоставляли операторам, им было неудобно работать — много времени отнимал поиск пользователей в базе по адресу почты и теме сообщений.

Так появился проект линковка.

Привет, друзья!

В этой статье я хочу поделиться с вами результатами небольшого эксперимента, связанного с ускорением загрузки изображений с помощью Imgproxy, Cache API (далее — кеш) и Service Worker API (далее — СВ).

Мы с вами разработаем простое приложение на React, в котором используется несколько изображений, и добьемся того, что загружаемые изображения будут более чем в 10 раз легче (меньше по размеру) оригиналов (imgproxy), а также практически мгновенной загрузки (доставки) изображений (СВ и кеш).

Обратите внимание: в части, касающейся imgproxy, особых препятствий на пути использования рассматриваемого в статье подхода к загрузке изображений в продакшне нет, но в части, касающейся СВ, следует проявлять крайнюю осторожность, поскольку данная технология является экспериментальной — это означает, что поведение СВ во многом определяется конкретной реализацией (браузером), что в ряде случаев делает его довольно непредсказуемым. Возможно, для кеширования изображений лучше предпочесть старые-добрые HTTP-заголовки Cache-Control и Etag. Но эксперимент на то и эксперимент, чтобы, в том числе, искать новые ответы на старые вопросы.

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

Остальных прошу под кат.

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

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

Чтобы повысить производительность страниц фронтенда на основе React, в Yelp используют рендеринг на стороне сервера. После ряда инцидентов на продакшене в начале 2021 года, когда из шаблонов на основе Python в React было перенесено много страниц, стало понятно, что существующая система серверного рендеринга не масштабируется. Материалом о том, как решалась проблема, делимся к старту курса по Fullstack-разработке на Python.

Привет, друзья!

В данной статье я хочу показать вам, как разработать простое приложение для обмена сообщениями в режиме реального времени с использованием Socket.io, Express и React с акцентом на работе с медиа.

Функционал нашего приложения будет следующим:

• при первом запуске приложение предлагает пользователю ввести свое имя;
• имя пользователя и его идентификатор записываются в локальное хранилище;
• при повторном запуске приложения имя и идентификатор пользователя извлекаются из локального хранилища (имитация системы аутентификации/авторизации);
• выполняется подключение к серверу через веб-сокеты и вход в комнату main_room (при желании можно легко реализовать возможность выбора или создания других комнат);
• пользователи обмениваются сообщениями в реальном времени;
• типом сообщения может быть текст, аудио, видео или изображение;
• передаваемые файлы сохраняются на сервере;
• путь к сохраненному на сервере файлу добавляется в сообщение;
• сообщение записывается в базу данных;
• пользователи могут записывать аудио и видеосообщения;
• после прикрепления файла и записи аудио или видео сообщения, отображается превью созданного контента;
• пользователи могут добавлять в текст сообщения эмодзи;
• текстовые сообщения могут озвучиваться;
• и т.д.

Репозиторий с исходным кодом проекта.

Если вам это интересно, прошу под кат.

В этой статье показан наш опыт интеграции интернета вещей (IoT) и метавселенной Decentraland. В ней вы найдете список необходимых навыков и мини-инструкцию, чтобы попробовать самим. В конце мы добавили видео-презентацию, что в итоге получилось. 

В этой статье вы увидите, как сделать генератор ASCII-арта из изображения.

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