This media is not supported in your browser
VIEW IN TELEGRAM
Полезный сервис для прокачки JavaScript — формат квестов и кода в одной геймифицированной платформе. Похоже на Codewars, но с вайбом мини-игры:
Особенности:
— Задания создают реальные пользователи
— Пишешь JS прямо в браузере, сразу проверяется
— Платформа open-source — можно форкнуть и сделать свою версию
🟣 Попробовать
@javascriptv
Особенности:
— Задания создают реальные пользователи
— Пишешь JS прямо в браузере, сразу проверяется
— Платформа open-source — можно форкнуть и сделать свою версию
@javascriptv
Please open Telegram to view this post
VIEW IN TELEGRAM
👍22❤10🔥2🤬1
Принцип простой: описываете, что хотите получить, нажимаете Optimize — GPT-5 анализирует запрос и выдаёт готовый детализированный промт. Работает бесплатно.
Инструмент может упростить работу с любыми нейросетями, особенно если у вас нет опыта в составлении промтов.
Готовый вы можете сразу попробовать в @Chatgpturbobot
Please open Telegram to view this post
VIEW IN TELEGRAM
👍6❤2
Media is too big
VIEW IN TELEGRAM
3D Galaxy Particles
Создано на canvas и анимировано с использованием TweenMax.
https://codepen.io/foretoo/details/zYjpYad
@javascriptv
Создано на canvas и анимировано с использованием TweenMax.
https://codepen.io/foretoo/details/zYjpYad
@javascriptv
👍10❤1
🧩 Тест по JavaScript
Какое ключевое слово в JavaScript используется для объявления переменной, которой нельзя присвоить новое значение после установки ее начального значения? @javascriptv
Какое ключевое слово в JavaScript используется для объявления переменной, которой нельзя присвоить новое значение после установки ее начального значения? @javascriptv
Anonymous Quiz
3%
A) let
2%
B) immutable
92%
C) const
3%
D) var
2😁27👍6🤔3😱3👎2❤1🔥1
⚙️ Metro UI — это современный фронтенд-фреймворк, который помогает разработчикам создавать быстрые и отзывчивые веб-приложения с приятным интерфейсом в стиле Metro. Его компоненты оптимизированы для мобильных устройств, а гибкость позволяет легко адаптировать проекты под любые экраны.
Фреймворк активно развивается: новые версии выходят почти каждую неделю, а сообщество в Discord всегда готово помочь. Хотя долгосрочная поддержка старых версий не предусмотрена, разработчики могут оставаться на проверенных релизах или оперативно обновляться для доступа к новым функциям.
🤖 GitHub
@javascriptv
Фреймворк активно развивается: новые версии выходят почти каждую неделю, а сообщество в Discord всегда готово помочь. Хотя долгосрочная поддержка старых версий не предусмотрена, разработчики могут оставаться на проверенных релизах или оперативно обновляться для доступа к новым функциям.
🤖 GitHub
@javascriptv
❤7👍2👎1
💡 Полезный и не банальный совет по JavaScript
Используй Intl.NumberFormat вместо ручного форматирования чисел.
Это встроенный API, который учитывает локаль и правила форматирования.
Пример
✅ Удобно для:
- финансовых приложений
- отображения дат и валют
- интернационализации (i18n)
Не изобретай велосипед — используй возможности языка 😉
@javascripv
Используй Intl.NumberFormat вместо ручного форматирования чисел.
Это встроенный API, который учитывает локаль и правила форматирования.
Пример
const number = 1234567.89;
const us = new Intl.NumberFormat("en-US").format(number);
const de = new Intl.NumberFormat("de-DE").format(number);
const jp = new Intl.NumberFormat("ja-JP").format(number);
console.log(us); // 1,234,567.89
console.log(de); // 1.234.567,89
console.log(jp); // 1,234,568
✅ Удобно для:
- финансовых приложений
- отображения дат и валют
- интернационализации (i18n)
Не изобретай велосипед — используй возможности языка 😉
@javascripv
👍29❤6🔥5
This media is not supported in your browser
VIEW IN TELEGRAM
27 августа встречаемся на DrinkUp от Авито для backend-разработчиков в Нижнем Новгороде. Уже предчувствуем горячие споры… ☄️
В планах в формате дискуссий обсудить:
➡️ как правильно структурировать проекты;
➡️ кому и как проще вкатиться в Go и почему он такой странный;
➡️ как LLM помогает разработчикам.
Остальные темы раскрывать не будем — можете посмотреть их по ссылке! Там же, кстати, и регистрация на ивент.
В планах в формате дискуссий обсудить:
Остальные темы раскрывать не будем — можете посмотреть их по ссылке! Там же, кстати, и регистрация на ивент.
Please open Telegram to view this post
VIEW IN TELEGRAM
❤3
🌱 turfjs — это javascript библиотека позволяющая выполнять пространственный анализ прямо в браузере или через node.js.
Проект включает более 200 модулей для различных операций с geojson от простых измерений расстояний до сложных геостатистических расчетов. Библиотека работает в современных браузерах и поддерживает актуальные версии node.js. Инструмент также имеет модульную структуру и активную аудиторию сообщества.
🤖 Github
@javascriptv
Проект включает более 200 модулей для различных операций с geojson от простых измерений расстояний до сложных геостатистических расчетов. Библиотека работает в современных браузерах и поддерживает актуальные версии node.js. Инструмент также имеет модульную структуру и активную аудиторию сообщества.
🤖 Github
@javascriptv
🔥7👍5❤3🤬1
🎯 Browserable — открытый инструмент для автоматизации браузера с помощью AI-агентов.
Что делает:
• Управляет браузером как человек: переходит по сайтам, кликает, заполняет формы, вытаскивает данные.
• Достигает 90.4 % на тесте Web Voyager — один из лучших результатов среди подобных решений.
• Работает локально (self-hosted) или через удалённые браузеры.
• Запуск в 1 команду (`npx browserable`) или в полном окружении через Docker.
• В комплекте: админ-панель, REST API, JavaScript/TypeScript SDK, интеграция с LLM (OpenAI, Claude, Gemini и др.).
Зачем полезно:
— Автопарсинг и мониторинг сайтов
— Автоматизация тестирования веб-приложений
— Интеграция с агентами для сложных сценариев в интернете
GitHub: https://github.com/browserable/browserable
Что делает:
• Управляет браузером как человек: переходит по сайтам, кликает, заполняет формы, вытаскивает данные.
• Достигает 90.4 % на тесте Web Voyager — один из лучших результатов среди подобных решений.
• Работает локально (self-hosted) или через удалённые браузеры.
• Запуск в 1 команду (`npx browserable`) или в полном окружении через Docker.
• В комплекте: админ-панель, REST API, JavaScript/TypeScript SDK, интеграция с LLM (OpenAI, Claude, Gemini и др.).
Зачем полезно:
— Автопарсинг и мониторинг сайтов
— Автоматизация тестирования веб-приложений
— Интеграция с агентами для сложных сценариев в интернете
GitHub: https://github.com/browserable/browserable
🔥8❤1😱1
👩💻 Готовы стать профи в Node.js-разработке и освоить самые востребованные технологии?
🔥 Курс «Node.js Developer» от OTUS – это ваш шанс научиться создавать высокопроизводительные серверные приложения с использованием Node.js, Express, TypeScript, GraphQL, Apollo и Nest.js. Мы фокусируемся на практических навыках, которые можно сразу применять в реальных проектах.
🦾 Освойте работу с базами данных MongoDB и PostgreSQL, научитесь создавать и оптимизировать запросы, а также внедрять лучшие практики разработки с TDD. Преподаватели-практики помогут вам разобраться в тонкостях разработки и архитектуры Node.js.
🎁 Дарим промокод, который дает скидку на обучение -
➡️ Пройдите вступительное тестирование и присоединяйтесь к группе: https://otus.pw/192c/
#реклама
О рекламодателе
🔥 Курс «Node.js Developer» от OTUS – это ваш шанс научиться создавать высокопроизводительные серверные приложения с использованием Node.js, Express, TypeScript, GraphQL, Apollo и Nest.js. Мы фокусируемся на практических навыках, которые можно сразу применять в реальных проектах.
🦾 Освойте работу с базами данных MongoDB и PostgreSQL, научитесь создавать и оптимизировать запросы, а также внедрять лучшие практики разработки с TDD. Преподаватели-практики помогут вам разобраться в тонкостях разработки и архитектуры Node.js.
🎁 Дарим промокод, который дает скидку на обучение -
NODE8➡️ Пройдите вступительное тестирование и присоединяйтесь к группе: https://otus.pw/192c/
#реклама
О рекламодателе
Сократите свой CSS-код с помощью
Используйте псевдокласс-функцию
@javascriptv
:where()Используйте псевдокласс-функцию
:where(), когда нужно применить одинаковые стили к нескольким элементам, не беспокоясь о том, что порядок селекторов повлияет на специфичность правил. Это простой способ сделать CSS более предсказуемым и удобным для поддержки.
/* Without :where() */
.container > h1,
.container > .card h1,
.container > .card:last-child {
border: 2px solid red;
padding: 10px;
}
/* With :where() */
.container > :where(h1, .card .h1, .card:last-child) {
border: 2px solid red;
padding: 10px;
}
@javascriptv
👍21🔥7❤4👎2
✍️ Шпаргалка по всем CSS-брейкпоинтам для веб разработчиков
➡️ Для мобильных устройств: до 480 пикселей
➡️ Для очень маленьких устройств: от 481 до 767 пикселей
➡️ Для маленьких планшетов: от 768 до 991 пикселей
➡️ Большие планшеты /ноутбуки: от 992 до 1199 пикселей
➡️ Настольные компьютеры: от 1200 до 1919 пикселей
➡️ Очень большие экраны: от 1920 пикселей и выше
@javascriptv
➡️ Для мобильных устройств: до 480 пикселей
➡️ Для очень маленьких устройств: от 481 до 767 пикселей
➡️ Для маленьких планшетов: от 768 до 991 пикселей
➡️ Большие планшеты /ноутбуки: от 992 до 1199 пикселей
➡️ Настольные компьютеры: от 1200 до 1919 пикселей
➡️ Очень большие экраны: от 1920 пикселей и выше
@javascriptv
👍31❤6🔥6
This media is not supported in your browser
VIEW IN TELEGRAM
🔥 Библиотека GeoAI.js теперь поддерживает Image Feature Extraction — поиск похожих объектов на спутниковых снимках.
Работает полностью локально в браузере благодаря Transformers.js.
👉 https://docs.geobase.app/geoai-live/tasks/image-feature-extraction
#gischat #javascript #geoai #transformersjs
Работает полностью локально в браузере благодаря Transformers.js.
👉 https://docs.geobase.app/geoai-live/tasks/image-feature-extraction
#gischat #javascript #geoai #transformersjs
👍7❤3🔥1
color cycling воскресили на HTML5 Canvas.
КРутейшая, но забытая технология из 8-битной эпохи, когда видеокарты умели максимум в 256 цветов. Художник задавал палитру, а программист просто сдвигал её — и картинка оживала: вода текла, огонь горел, туман плыл. Ни анимации, ни альфы — один спрайт и картина готова.
Вообще, обыычно это выглядело как кислотный ад, но Марк Дж. Феррари (LucasArts, Loom, Monkey Island) сделал из трюка искусство: снег, дождь, океаны, облака, водопады — и всё это на плоской картинке.
В проекте — 35 оригинальных артов Феррари с атмосферным саундом. Можно залипнуть, а можно скачать движок и прикрутить к своим проектам.
Создаем искусство
КРутейшая, но забытая технология из 8-битной эпохи, когда видеокарты умели максимум в 256 цветов. Художник задавал палитру, а программист просто сдвигал её — и картинка оживала: вода текла, огонь горел, туман плыл. Ни анимации, ни альфы — один спрайт и картина готова.
Вообще, обыычно это выглядело как кислотный ад, но Марк Дж. Феррари (LucasArts, Loom, Monkey Island) сделал из трюка искусство: снег, дождь, океаны, облака, водопады — и всё это на плоской картинке.
В проекте — 35 оригинальных артов Феррари с атмосферным саундом. Можно залипнуть, а можно скачать движок и прикрутить к своим проектам.
Создаем искусство
This media is not supported in your browser
VIEW IN TELEGRAM
🔥23❤1👍1
🚀 Qwen Chat Web Dev Prompt — мощный промпт для frontend-разработки с упором на дизайн.
Он помогает разработчикам быстро создавать сайты на React или HTML с использованием TailwindCSS, анимаций и современных UI-паттернов — всё в одном чистом кодовом блоке.
✨ Зачем нужен:
✅ Генерация React/HTML в одном файле
✅ Поддержка популярных библиотек: React, Tailwind, Recharts, Framer Motion, p5.js, Three.js
✅ Никаких внешних зависимостей — только чистый, готовый к запуску код
Идеально для быстрых прототипов и создания полноценных проектов.
👉 Попробовать: https://chat.qwen.ai/?inputFeature=web_dev
👉В хорошем качестве: https://x.com/Alibaba_Qwen/status/1960960780947611957
@javascriptv
Он помогает разработчикам быстро создавать сайты на React или HTML с использованием TailwindCSS, анимаций и современных UI-паттернов — всё в одном чистом кодовом блоке.
✨ Зачем нужен:
✅ Генерация React/HTML в одном файле
✅ Поддержка популярных библиотек: React, Tailwind, Recharts, Framer Motion, p5.js, Three.js
✅ Никаких внешних зависимостей — только чистый, готовый к запуску код
Идеально для быстрых прототипов и создания полноценных проектов.
👉 Попробовать: https://chat.qwen.ai/?inputFeature=web_dev
👉В хорошем качестве: https://x.com/Alibaba_Qwen/status/1960960780947611957
@javascriptv
❤4🔥3🤬3👍2😁1😱1
Теперь это бесплатная и опенсорсная реализация, которая компилируется в JS и работает как в браузере, так и в Node.js. Сохраняется дух полностью объектно-ориентированного Smalltalk, но с привычным синтаксисом и экосистемой JS.
● Вместо «имиджей» используется файловая структура — удобно писать в VS Code
● Подсветка кода и отладка доступны сразу «из коробки»
● Классы и методы максимально близки к JavaScript, поэтому порог входа минимален
● Встроены браузерные API, Express, базы данных, файловая система и даже многопоточность
⚡ Еще недавно появилась поддержка NW.js, так что теперь можно собирать кроссплатформенные десктопные приложения с интерфейсами на HTML+CSS — легче и менее прожорливо, чем на Electron.
👉 Подробнее и с примерами: https://small-js.org/
Please open Telegram to view this post
VIEW IN TELEGRAM
❤3👍3🔥1
Авито устраивает IT-квест и вечеринку для инженеров в секретном месте в честь открытия офиса в Нижнем Новгороде.
Обещают много нетворка, Fuckup Night и инсайты о том, что у Авито «под капотом». Пересылайте пост друзьям, с которыми пойдёте, и не забудьте зарегистрироваться по ссылке.
Please open Telegram to view this post
VIEW IN TELEGRAM
1❤2👎2🔥2😢2
Anonymous Quiz
3%
1
33%
false
13%
true
39%
undefined
12%
Посмотреть ответы
👍2❤1
📄🚀 Удобный просмотр кода с rendergit
С помощью rendergit вы можете легко преобразовать любой репозиторий GitHub в статическую HTML-страницу с подсветкой синтаксиса и навигацией. Идеально подходит для быстрого просмотра, анализа кода и удобного поиска.
🚀Основные моменты:
- Два режима просмотра: Человеческий и LLM
- Подсветка синтаксиса и рендеринг Markdown
- Умное фильтрование больших файлов
- Адаптивный дизайн для мобильных устройств
- Удобная навигация по файлам
📌 GitHub: https://github.com/karpathy/rendergit
С помощью rendergit вы можете легко преобразовать любой репозиторий GitHub в статическую HTML-страницу с подсветкой синтаксиса и навигацией. Идеально подходит для быстрого просмотра, анализа кода и удобного поиска.
🚀Основные моменты:
- Два режима просмотра: Человеческий и LLM
- Подсветка синтаксиса и рендеринг Markdown
- Умное фильтрование больших файлов
- Адаптивный дизайн для мобильных устройств
- Удобная навигация по файлам
📌 GitHub: https://github.com/karpathy/rendergit
👍6🔥2❤1