Розуміння подій у Node.js

pic

Вступ

Node.js відомий своєю асинхронною, подієво орієнтованою архітектурою, що дозволяє розробникам обробляти кілька операцій одночасно. Ключовим елементом цієї архітектури є модуль EventEmitter. У цій статті ми розглянемо, що таке EventEmitter, як він працює та коли його використовувати, із прикладами для кращого розуміння.

Що таке EventEmitter?

EventEmitter — це основний модуль у Node.js, який забезпечує зв’язок між об'єктами. Він дозволяє створювати, слухати та обробляти власні події в додатках. По суті, він допомагає розділити компоненти, дозволяючи їм взаємодіяти через події.

Модуль events необхідно підключити для використання EventEmitter:

const EventEmitter = require('events');

Основне використання

Розглянемо простий приклад:

const EventEmitter = 
Читати далі

Створення хмарного трекера витрат

pic

Чому я почав і створив цей проєкт?

  • Ручне відстеження витрат може бути виснажливим, тому я вирішив створити веб-додаток для відстеження витрат, щоб спростити цей процес.
  • У цьому проєкті я створив повний стек трекера витрат, використовуючи React для фронтенду, Azure Functions для бекенду та Azure Static Web Apps для хостингу.

Структура проєкту

Фронтенд —

  • Створений з React для створення адаптивного інтерфейсу користувача.
  • Обробляє введення користувача для реєстрації та візуалізації витрат.
  • Розгорнутий за допомогою Azure Static Web Apps.

Бекенд —

  • Безсерверна архітектура на базі Azure Functions.
  • Надає REST API для:
    • Отримання витрат.
    • Додавання даних про витрати.
    • Видалення даних про витрати.
    • Генерації графіків
Читати далі

Коротка історія фронтенд-інженерії

pic
](https://leapcell.io/?lct=mfronteng)

Вступ до фронтенд-інженерії

Фронтенд-інженерія — це практика систематизації, автоматизації та стандартизації фронтенд-розробки за допомогою набору інструментів, методів та процесів, щоб підвищити ефективність розробки, якість коду та можливості управління проєктами.

Зокрема, фронтенд-інженерія охоплює такі аспекти:

  • Модульна розробка: Розбиття складних фронтенд-додатків на незалежні, багаторазово використовувані модулі або компоненти. Такий підхід покращує підтримуваність коду та сприяє співпраці в команді.
  • Автоматизовані інструментальні ланцюги: Використання різноманітних інструментів для автоматизації рутинних завдань у фронтенд-розробці, таких як упаковка коду (наприклад, Webpack), компіляція (наприклад, Babel), тестування (наприклад, Jest), лінтинг коду та форматування (наприклад, ESLint і Prettier). Ці інструменти знижують кількість помилок і підвищують
Читати далі

Оптимізація веб-продуктивності: Просунуті стратегії стиснення

pic

У світі веб-розробки продуктивність — це король. Один з найефективніших способів покращити швидкість додатків і зменшити споживання пропускної здатності — це використання розумних технік стиснення. Хоча багато розробників спочатку впроваджують стиснення на рівні додатка, досвідчені інженери розуміють, що стиснення на рівні сервера пропонує більш потужні та ефективні рішення.

Ландшафт стиснення

Стиснення — це не просто технічна оптимізація — це критична стратегія для покращення користувацького досвіду та зниження витрат на інфраструктуру. Зменшуючи розмір даних, що передаються між серверами та клієнтами, ми можемо:

  • Значно зменшити затримку в мережі
  • Зменшити навантаження на сервер
  • Покращити загальну чутливість додатка
  • Знизити споживання пропускної здатності та супутні
Читати далі

За лаштунками Node.js: огляд на високому рівні

Якщо ви шукаєте "Що таке Node.js", ймовірно, ви знайдете таке визначення:

"Node.js — це безкоштовне, з відкритим вихідним кодом, кросплатформенне середовище виконання JavaScript, яке дозволяє розробникам створювати сервери, веб-додатки, інструменти командного рядка та сценарії."

Але що насправді означає "середовище виконання JavaScript"? Щоб зрозуміти це, давайте розберемо по кроках.

Розбір середовища виконання JavaScript

Уявіть, що у вас є рецепт для найсмачнішої страви. Це шедевр. Але рецепт сам по собі не може приготувати їжу — вам потрібно:

  • Шеф-кухар: Людина, яка розуміє рецепт і може приготувати страву
  • Кухня: Простір з інструментами та інгредієнтами для того, щоб рецепт став реальністю

pic

Photo by Читати далі

11 порад, як покращити вміння маніпулювати масивами за допомогою Node.js

Основні принципи програмування залишаються незмінними, незалежно від мови — будь то Node.js, JavaScript, C++, C#, Go або будь-яка інша. Кожна мова побудована на основних концепціях програмування, таких як абстракція (abstraction), наслідування (inheritance), інкапсуляція (encapsulation), алгоритми (algorithms), типи даних (data types), класи (classes), цикли (loops), масиви (arrays), словники (dictionaries), хеш-таблиці (hashmaps), зв'язні списки (linked lists), рядки (strings), числа (numbers), булеві значення (booleans) і багато іншого.

Тим не менш, кожна мова має свої унікальні особливості та особливості, пропонуючи різні способи досягнення тієї ж мети. Кажучи про це, давайте поговоримо про те, як працювати з масивами (arrays) у Node.js.

Дайте мені лише 4 … Читати далі

“Cron Job (Завдання за розкладом) для бідних у Next”

pic

Photo by Sebastian Svenson on Unsplash

Сьогодні мені потрібно швидко і без зайвих витрат реалізувати cron job (завдання за розкладом) у моєму додатку на Next.js для демонстрації концепції. Мій додаток — це простий додаток на Next.js, який працює як фронтенд, так і бекенд. Я розгортаю його за допомогою AWS Amplify, але не використовую складних налаштувань, таких як функції AWS Lambda, оскільки не маю на це часу.

Я також не потребую складної інфраструктури, а мій бюджет дуже обмежений. Тому я вирішив створити "cron job (завдання за розкладом) для бідних", який працюватиме безпосередньо всередині додатка на Next.js, використовуючи бібліотеку node-cron.

Ось … Читати далі

Давайте спробуємо створити Monorepo.

pic

https://www.aviator.co/blog/monorepo-a-hands-on-guide-for-managing-repositories-and-microservices/

Не так давно я стикався з проблемою використання однакових компонентів і конфігурацій у кількох проектах одночасно. Спочатку я використовував метод розділення Git Repo для спільних частин, але результат був таким, що інколи спільний код не оновлювався або виникали баги, що вимагало частих оновлень. Це призвело до пошуку рішення, і я натрапив на техніку, яку називають Monorepo. Коли я почав читати про концепцію, я зрозумів, що ця техніка може допомогти вирішити мою проблему. Тому я вирішив написати цей блог, щоб поділитися та зберегти його для себе, а також поділитися з іншими розробниками, щоб вони могли використовувати і розвивати це … Читати далі

WebGPU Рендеринг: Частина 15 Прозорість за допомогою зняття глибини

pic

Вступ

Я читаю онлайн книгу про WebGPU. У цій серії статей я буду розглядати цю книгу та реалізовувати уроки в більш структурованому підході з використанням класів TypeScript, і в кінцевому підсумку ми побудуємо три типи рендерерів WebGPU: Gaussian Splatting, Ray tracing та Rasterization.

У цій статті ми поговоримо про Depth Peeling — техніку рендерингу, що використовується для точного відображення перекритих прозорих об'єктів шляхом "зняття" шарів глибини сцени. В кожному проході вона захоплює найближчі видимі прозорі фрагменти, змішує їх, а потім переходить до наступного шару ззаду, поки всі шари не будуть відрендерені. Це забезпечує правильне змішування та уникнення артефактів через некоректне … Читати далі

Проєкт GTA V HEIST HACK — Міні-гра Laptop

Презентація

Цей проєкт натхненний грою GTA V, а точніше сервером NoPixel, який є сервером RP (Roleplay). Сервер RP — це тип сервера, на якому гравці виконують роль персонажа та взаємодіють з іншими гравцями в віртуальному середовищі.

У цьому проєкті, коли гравець здійснює напад на банк, йому потрібно вирішити головоломку. Якщо гравець успішно вирішить головоломку, він обійде систему безпеки та зможе отримати доступ до сховищ, щоб забрати гроші. Якщо ж він не впорається, напад буде зірвано, і він не зможе отримати доступ до грошей.

У цьому проєкті я розроблю кілька головоломок. Але сьогодні я розповім зокрема про головоломку Laptop Hack Puzzle.… Читати далі