Javascript

🖥 Qwik — фреймворк на TypeScript, который обеспечивает мгновенную загрузку веб-приложений любого размера и сложности

— npm create qwik@latest

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

🟡 Доки
🟡 Примеры использования
🖥 GitHub

@javascriptv

🖥 Abracadabra — автоматизированный рефакторинг JS и TS для VSCode

Фичи Abracadabra:
— ярлыки для быстрого запуска самых полезных опций рефакторинга
— гибкая настройка UI
— работает с файлами .js, .jsx, .ts, .tsx, .vue и .svelte

🖥 GitHub
🟡 Расширение VSCode

@javascriptv

🖥 Cyber Swiss Army Knife — JS-приложение для шифрования, кодирования, сжатия и анализа данных

CyberChef — это интуитивно понятное приложение на JavaScript для выполнения всевозможных операций в браузере, таких как например кодирование, XOR и Base64, или более сложное шифрование, например AES, DES и Blowfish, или создание бинарных и шестнадцатеричных дампов.
Ну и сжатие и декомпрессия данных, вычисление хэшей и контрольных сумм, разбор IPv6 и X.509, изменение кодировок символов и многое другое.

Быстрый старт с Docker:
docker run -it -p 8080:80 ghcr.io/gchq/cyberchef:latest

🖥 GitHub
🟡 CyberChef онлайн

@javascriptv

🖥 reveal.js — open-source фреймворк для создания HTML-презентаций

Фреймворк обладает мощным набором функций, включая поддержку Markdown, возможность создания анимаций, экспорт в PDF, наличие заметок для докладчика, поддержку верстки в LaTeX, код с подсветкой синтаксиса и удобный API.

🖥 GitHub
🟡 Пример такой презентации

@javascriptv

🖥 Подробный туториал о том, как сделать эффект размытия линзы с помощью SDF и WebGL в Three.js

🟡 Туториал
🖥 Код

@javascriptv

🖥 SigNoz — open-source платформа для мониторинга производительности приложений и не только; можно развернуть локально

git clone -b main https://github.com/SigNoz/signoz.git && cd signoz/deploy/
./install.sh

SigNoz позволяет делать довольно много всего, в том числе:
— отслеживать такие показатели приложения, как количество внешних вызовов API
— отслеживать такие аппаратные показатели как загрузка процессора или использование памяти
— автоматически фиксировать выбрасываемые исключения на Python, Java, Ruby и Javascript

Быстрый старт с помощью Docker Compose:

git clone -b main https://github.com/SigNoz/signoz.git && cd signoz/deploy/
docker compose -f docker/clickhouse-setup/docker-compose.yaml up -d

🖥 GitHub
🟡 Доки

@javascriptv

🖥 immich — высокопроизводительное self-hosted решение на TypeScript и Dart для хранения фото и видео

Для экспериментов запустить можно так, а вообще, рекомендуется использовать Docker Compose
— curl -o- https://raw.githubusercontent.com/immich-app/immich/main/install.sh | bash

🖥 GitHub
🟡 Доки

@javascriptv

🖥 Интересная идея для прелоадера страницы на чистом CSS

Фигурки тетриса бесконечно складываются в правильном порядке — выглядит довольно оригинально
Может неплохо сказаться на конверсии

📎 Codepen

@javascriptv

🖥 Интересная идея для пет-проекта на TypeScript

Как это работает?
— состояния документов синхронизируются с помощью Loro
— позиция курсора синхронизируется с помощью Awareness и Cursor
— последовательность действий хранится, так что можно отменить предыдущее действие

🖥 GitHub

@javascriptv

Vercel Data Cache остается неизменным в течение всего периода развертывания

@javascriptv

🖥 Интересная идея для пет-проекта — 3D-модель дерева, которую можно изменять при помощи разных параметров

🖥 GitHub
🟡 Демонстрация проекта

@javascriptv

🖥 The Odin Project — это open-source проект, предоставляющий всю необходимую теорию начинающим разработчикам (в том числе и JS-разработчикам)

The Odin Project состоит из множества модулей (по модулю для одного ЯП)
Каждый модуль содержит список уроков, перемежающихся с несколькими проектами. Эти проекты дают пользователям возможность практиковать полученные знания, помогая закрепить полученные теоретические знания.

В процессе прохождения модуля по JavaScript создаваются функции и автономные приложения. Этот модуль помогает на практике научиться работать с DOM, использовать принципы ООП и использовать API.

🟡 The Odin Project (модуль по JavaScript)
🖥 GitHub

@javascriptv

⚡️ Красивая анимированная шкала рейтинга на JS + CSS


👉 Код на codepen

#soft #code

@javascriptv

🖥 Snap.svg — современная JavaScript библиотека для SVG-графиков

— npm install snapsvg

JS-библиотека Snap.svg делает работу с SVG такой же простой, как jQuery делает работу с DOM.
Snap.svg разработан для современных браузеров и поэтому поддерживает новейшие возможности SVG, такие как маскирование, обрезка, полные градиенты, группы и многое другое.

🖥 GitHub
🟡 Доки

@javascriptv