Javascript

⚡️ Анимация Пикачу в коробке

Анимированный пикачу в коробке отрисован и анимирован с помощью чисто CSS. Отдельные элементы графики сделаны с помощью DIV’ов и затем стилизованы.

Чтобы запустить анимацию нужно нажать на верх коробки и потянуть курсов в сторону. Попробуйте сами. Там же вы найдёте код проекта:

https://codepen.io/maxi83c/pen/JjOZdWX

#codepen #css

🖥 LlamaIndex.TS — фреймворк TypeScript, который предоставляет возможности LlamaIndex для Node.js, Vercel Edge Functions и Deno

LlamaIndex.TS отлично подходит для таких применений:

— извлечение данных: преобразование сырых данных в структурированные и стандартизированные форматы

— RAG: ответы на запросы по внутренним данным путем предоставления LLM контекста из документов и файлов

— автономные агенты: создание агентов для выполнения задач в интерактивном, неконтролируемом режиме

🖥 GitHub
🟡 Доки

@javascriptv

🖥 Eidos — оффлайн альтернатива Notion на TypeScript

Eidos — это расширяемый фреймворк TypeScript для удобного управления своими данными.

Особенности Eidos:
— работает полностью оффлайн, данные хранятся локально

— можно подключить любимую LLM для дополнительных возможностей

— полностью open-source

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

Быстрый старт с Docker:

docker run -d  -p 8080:80 ghcr.io/mayneyao/eidos

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

@javascriptv

🖥 htmlparser2 — очень быстрый парсер HTML на TypeScript

— npm install htmlparser2

Когда-то htmlparser2 был создан как форк htmlparser, и на данный момент htmlparser2 — это один из самых быстрых парсеров HTML и XML.
Написан на TypeScript.

🖥 GitHub
🟡 Доки

@javascriptv

🖥 ​​Полезный Репозиторий для тренировки по JavaScript

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

https://github.com/lydiahallie/javascript-questions/tree/master/ru-RU

#репозиторий #js #ru

@javascriptv

⚡️Интерактивный тренажёр для фронтенд-разработчиков

Создатели включили в тренажёр более 1,5 тысяч упражнений, что обеспечивает достаточно практики для освоения фронтенда.

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

Этот ресурс будет вам полезен:

📌 Ссылка

@javascriptv

🖥 Бесплатный фоновый ремувер заднего фона, работающий в вашем браузере на базе WebGPU (с использованием transformer.js)

И да, он с открытым исходным кодом, так что вы можете развернуть свой собственный экземпляр в любом месте. https://github.com/ducan-ne/remove-bg

@javascriptv

⚡️ Интерактивная форма для ввода данных, которая плавно появляется при загрузке.

#формы #текст

https://codepen.io/rikhnovets/pen/WNBRqNG

@javascriptv

🖥 eleventy — нереально простой генератор статических сайтов на JavaScript

— npm install @11ty/eleventy --save-dev

Более простой генератор статических сайтов, чем Jekyll; написан на JavaScript.
Работает с HTML, Markdown, JavaScript, Liquid, Nunjucks, с аддонами для WebC, Sass, Vue, Svelte, JSX и многих других

echo '# Heading' > index.md
npx @11ty/eleventy

🖥 GitHub
🟡 Доки

@javascriptv

🎞 YouTube Addiction Rehab — это расширение для Chrome, разработанное для помощи пользователям в контроле их привычек просмотра видео на YouTube с помощью ИИ.

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

Ключевые функции включают AI Focus Filter, блокирующий нерелевантные рекомендации, AI Smart Blocker, предотвращающий доступ к отвлекающим видео, и возможность скрытия коротких роликов из рекомендованной ленты.

Установка расширения немного отличается для браузеров Chrome, Firefox и Safari, и для каждого из них предоставлены детальные инструкции.

▪ Github

#TypeScript #JavaScript

@javascriptv

🖥 Terser — минификатор JavaScript-кода

— npm install terser -g

Terser позволяет сильно сжать JS код: он сокращает имена переменных, удаляет пробельные символы, комментарии и неиспользуемый код.
Можно использовать его как CLI или при помощи Node.js API.

🖥 GitHub
🟡 Доки

@javascriptv

🌟 Pake — инструмент, позволяющий пользователям превратить любую веб-страницу в настольное приложение с помощью Rust.

- Поддерживает Mac, Windows и GNU/Linux.
- Pake почти в 20 раз меньше Electron и работает быстрее фреймворков на основе JS.

▪ Github

@javascriptv

👣 Если вы создаете API, вот вам 6 архитектур которые нужно знать

Проектирование API — это не только работа над функциональностью, но и выбор правильной архитектуры для удовлетворения ваших потребностей.

Вот шесть архитектурных проектов API, с которыми должен быть знаком каждый разработчик:

1️⃣ — REST
— Самая популярная архитектура для веб-сервисов.
— Использует HTTP-запросы для связи.
— Не сохраняет состояние и обеспечивает легкую масштабируемость и гибкость.

2️⃣ — GraphQL
— Язык запросов для вашего API.
— Позволяет клиентам запрашивать именно то, что им нужно, не больше и не меньше.
— Идеально подходит для оптимизации сетевых запросов.

3️⃣ — SOAP (устаревший)
— Протокол для обмена структурированной информацией в веб-сервисах.
— Известен своими строгими стандартами и встроенной обработкой ошибок.
— Часто используется в приложениях корпоративного уровня.

4️⃣- gRPC
- Высокопроизводительная среда с открытым исходным кодом.
- Использует HTTP/2 для транспорта и буферы протоколов в качестве языка описания интерфейса.
- Отлично подходит для микросервисов и общения в реальном времени.

5️⃣- WebSockets
- Обеспечивает двустороннюю связь между клиентом и сервером.
- Идеально подходит для приложений реального времени, таких как чат-приложения и обновления в реальном времени.
- Позволяет осуществлять непрерывный обмен данными без накладных расходов HTTP.

6️⃣ - MQTT
- Легкий протокол обмена сообщениями для небольших датчиков и мобильных устройств.
- Ориентирован на минимальное использование полосы пропускания и заряда батареи.
- Обычно используется в приложениях IoT (Интернет вещей).

🖥 Сохраняй, чтобы не потерять и перешли коллеге

#doc #cheatsheet #api

@javascriptv