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

npm install snapsvg

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

🖥 GitHub
🟡 Доки

@javascriptv
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
👍10🔥32
This media is not supported in your browser
VIEW IN TELEGRAM
⚡️ Красивая анимированная шкала рейтинга на JS + CSS


👉 Код на codepen

#soft #code

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

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

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

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

@javascriptv
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
👍24🔥72
This media is not supported in your browser
VIEW IN TELEGRAM
🖥 Интересная идея для пет-проекта — 3D-модель дерева, которую можно изменять при помощи разных параметров

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

@javascriptv
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥26👍92
This media is not supported in your browser
VIEW IN TELEGRAM
Vercel Data Cache остается неизменным в течение всего периода развертывания

@javascriptv
👍85🥰1
This media is not supported in your browser
VIEW IN TELEGRAM
🖥 Интересная идея для пет-проекта на TypeScript

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

🖥 GitHub

@javascriptv
Please open Telegram to view this post
VIEW IN TELEGRAM
👍144🥰1
This media is not supported in your browser
VIEW IN TELEGRAM
🖥 Интересная идея для прелоадера страницы на чистом CSS

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

📎 Codepen

@javascriptv
Please open Telegram to view this post
VIEW IN TELEGRAM
👍27🔥113🎉1
🖥 immich — высокопроизводительное self-hosted решение на TypeScript и Dart для хранения фото и видео

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

🖥 GitHub
🟡 Доки

@javascriptv
Please open Telegram to view this post
VIEW IN TELEGRAM
👍113🔥1
🖥 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
Please open Telegram to view this post
VIEW IN TELEGRAM
5👍3🔥1
This media is not supported in your browser
VIEW IN TELEGRAM
🖥 Подробный туториал о том, как сделать эффект размытия линзы с помощью SDF и WebGL в Three.js

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

@javascriptv
Please open Telegram to view this post
VIEW IN TELEGRAM
21👍6🥰2
This media is not supported in your browser
VIEW IN TELEGRAM
🖥 reveal.js — open-source фреймворк для создания HTML-презентаций

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

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

@javascriptv
Please open Telegram to view this post
VIEW IN TELEGRAM
👍231🔥1
🖥 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
Please open Telegram to view this post
VIEW IN TELEGRAM
👍173🔥3
This media is not supported in your browser
VIEW IN TELEGRAM
🖥 Abracadabra — автоматизированный рефакторинг JS и TS для VSCode

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

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

@javascriptv
Please open Telegram to view this post
VIEW IN TELEGRAM
15👍6🔥4
🖥 Qwik — фреймворк на TypeScript, который обеспечивает мгновенную загрузку веб-приложений любого размера и сложности

npm create qwik@latest

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

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

@javascriptv
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
👍12🔥62😁2😢1
This media is not supported in your browser
VIEW IN TELEGRAM
🖥 POLINE — отличная библиотека TypeScript для генерации палитры цветов

npm install poline

Название "POLINE" связано с сутью генератора — проведением линии в полярных координатах.

🟡 Генератор POLINE
🖥 GitHub

@javascriptv
Please open Telegram to view this post
VIEW IN TELEGRAM
👍112🔥2😁2
🖥 Zero Width Shortener — интересный проект на TypeScript, который позволяет поместить любую ссылку в https://zws.im/

Отличная идея для пет-проекта, как минимум интересно выглядит

Вот так например выглядит ссылка на этот канал — https://zws.im/󠁩󠁭󠁺󠁩󠁩󠁩󠁯

🖥 GitHub
🟡 Страничка ZWS

@javascriptv
Please open Telegram to view this post
VIEW IN TELEGRAM
👍10👎3🔥32
2025/07/14 16:53:43
Back to Top
HTML Embed Code: