Новый домен

Переехал на новый домен: https://sqlzzy.dev/

Игра "Самый быстрый расшифровщик" теперь размещается по адресу: https://encryption-game.sqlzzy.dev/

Всем кода без легаси и багов!

#aboutwebdev_блог

Нововведения в сервере ExpressJS + Socket.io. v2.1.0

Второй пункт из списка анонсов готов.

Нововведения в платформе:
1) создание списка игроков, находящихся в раунде;
2) отображение списка игроков в раунде;
3) отображение сообщений о статусе игры для игроков;
4) функция ожидания для новых игроков в комнате после начала раунда;
5) стили для всех страниц.

Ссылка на платформу: https://github.com/sqlzzy/socket-express-server

Всем кода без легаси и багов!

#aboutwebdev_личныйпроект #aboutwebdev_конфиги #aboutwebdev_опенсорс

Пост с советами по созданию телеграм-ботов

Разрабатывая телеграм-бота, я изучал и искал информацию о том, как его сделать лучше.

Мне попался пост с описанием распространненых ошибок при его реализации.

Каждый сможет для себя выделить интересные моменты при написании своего телеграм-бота.

Ссылки:
Часть 1: https://vc.ru/dev/353847-pora-delat-normalnyh-telegram-botov

Часть 2: https://vc.ru/dev/383602-pora-delat-normalnyh-telegram-botov-2

Часть 3: https://vc.ru/dev/776308-pora-delat-normalnyh-telegram-botov-3

Всем кода без легаси и багов!

#aboutwebdev_моярекомендация

Скрипт для обновления устаревших пакетов в package.json

Со временем пакеты обновляются разработчиками, поэтому нужно периодически обновлять их в своём проекте.

Для того, чтобы не упустить из виду каждый устаревший пакет из package.json, написал скрипт для его обновления:

import { exec } from "child_process";
import { promisify } from "util";

const execPromise = promisify(exec);

function execAsync(command) {
  return new Promise(function (resolve, reject) {
    exec(command, (error, stdout, stderr) => {
      if (stderr !== "") {
        reject(stderr);
      } else {
        resolve(stdout);
      }
    });
  });
}

async function updatePackages() {
  try {
    const packages = await execAsync("npm outdated --depth=0 --json");

    const outdatedPackages = JSON.parse(packages);
    const packagesToUpdate = Object.keys(outdatedPackages);

    if (packagesToUpdate.length === 0) {
      console.log("Все пакеты уже обновлены!");
      return;
    }

    const updateCommands = packagesToUpdate.map(
      (pkg) => `npm install ${pkg}@latest`
    );
    const updateResults = await execPromise(updateCommands.join(" && "));

    if (updateResults.stderr) {
      throw new Error(updateResults.stderr);
    }

    console.log("Все устаревшие пакеты были обновлены до последней версии");
  } catch (error) {
    console.error("Произошла ошибка:", error);
  }
}

updatePackages();

Всем кода без легаси и багов!

#aboutwebdev_личныйпроект #aboutwebdev_конфиги

deps-updater

Решил выложить скрипт для обновления устаревших зависимостей проекта в npm.

Установка: npm install --save-dev deps-updater

Запуск скрипта: npm run deps-updater

Предложения или найденные баги пишите сюда: https://github.com/sqlzzy/deps-updater/issues

Гитхаб: https://github.com/sqlzzy/deps-updater

npm: https://www.npmjs.com/package/deps-updater

Всем кода без легаси и багов!

#aboutwebdev_личныйпроект #aboutwebdev_опенсорс

Плейлист

Бывает ситуация, когда в процессе работы используются одни и те же знания и забывается другая немаловажная информация по разработке.

Чтобы периодически освежать в памяти знания по разработке, я сделал себе плейлист.

Постепенно он будет пополняться.

Ссылка: https://www.youtube.com/playlist?list=PLxupoDnGjaRzRzv0QkOh7nBmzOHdB-J7x

Всем кода без легаси и багов!

#aboutwebdev_личныйпроект #aboutwebdev_моярекомендация #aboutwebdev_веб

Забавный фейл с моим npm-пакетом

Вчера сел за пет-проект и решил обновить в нем зависимости с помощью своего npm-пакета deps-updater.
Оказалось, что пакет нельзя запустить в проекте.

Чтобы запускать из командной строки надо было создать файл index.js (к примеру) в папке bin с таким содержанием:

#!/usr/bin/env node

//инициализация скрипта

и если хотите глобально вызывать скрипт, то в package.json пакета нужно указать:

"bin": {
    "deps-updater": "./bin/deps-updater.js"
 }

После установки пакета нужно создать в package.json проекта в "noscripts" свою команду и указать путь до исполняемого скрипта:

"your_command": "./node_modules/deps-updater/bin/deps-updater.js"

Теперь можно запускать в консоли "npm run your_command" и deps-updater обновит устаревшие зависимости.

#aboutwebdev_личныйпроект #aboutwebdev_опенсорс #aboutwebdev_веб

Нововведения в игре

Пришла идея добавить qr-код ссылки в свою игру "Самый быстрый расшифровщик".
Сначала думал самому генерацию qr-кода написать, но потом, изучив информацию по структуре qr-кода, решил использовать готовую библиотеку для NodeJs — node-qrcode.

О нововведениях:
- табы для переключения способов поделиться игрой: ссылкой или qr-кодом (страницы лобби и игрока);
- менее насыщенный цвет контента, жирнее шрифт, больше межбуквенное расстояние;
- ссылка на код игры;
- open-graph метатеги.

Ссылка на игру: https://encryption-game.sqlzzy.dev/

Гитхаб игры: https://github.com/sqlzzy/encryption-game

Приятной игры!

Всем кода без легаси и багов!

#aboutwebdev_личныйпроект

Первая посещëнная конференция 😄

#aboutwebdev_митап

Олдскул шрифты

Недавно наткнулся на сайт с олдскульными шрифтами от IBM PC до разных производителей техники.

На сайте можно конфигурировать размер выбранного шрифта и видеть демо.

Представленные на сайте шрифты можно скачать по лицензии CC BY-SA 4.0 и использовать в своих пет-проектах.

Ссылка на сайт с олдскульными шрифтами: https://int10h.org/oldschool-pc-fonts/

#aboutwebdev_моярекомендация

Игра "Самый быстрый расшифровщик" v.2.0

С радостью представляю вторую версию игры "Самый быстрый расшифровщик".

В новой версии игры были добавлены:
- режим одиночной игры;
- олдскульный шрифт;
- отображение ошибок при вводе данных.

Впереди интересные обновления!

Приятной игры!

Ссылка на игру: https://encryption-game.sqlzzy.dev/

Гитхаб игры: https://github.com/sqlzzy/encryption-game

P.S. Найденные баги пишите в https://github.com/sqlzzy/encryption-game/issues

#aboutwebdev_личныйпроект

Тень блока с градиентом

На досуге написал карточки с градиентыми бордерами и появлением градиентой тени при наведении на них.

Демо: https://codepen.io/sqlzzy/full/LYoPJeL

Мой кодпен с другими поделками: https://codepen.io/sqlzzy

Делитесь своими профилями кодпена в комментариях поста 👇

#aboutwebdev_кодпен

Блог

Первое упоминание о блоге датировано 28 августа 2022 года.

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

Блог: https://sqlzzy.dev/

Велком!

#aboutwebdev_блог

Полезности

Теперь документации, различные инструменты и ресурсы, которыми пользуюсь, находятся в одном месте!

Сделал разделы:
- документации;
- всяко-разно;
- ютуб;
- для вдохновения.

По мере встречи с новыми интересными ресурсами будут добавляться новые разделы (возможно 😁).

Ссылка: https://sqlzzy.dev/library/

Велком!

#aboutwebdev_блог