Tunnel Run длиной 170 строк на чистом JS
Реализация игры в которой нужно бегать и прыгать через туннель. Отображение двумерной сетки как трёхмерного туннеля с помощью функций sin и cos вместе с перспективным масштабированием. Простое объяснение реализации без углубления в тригонометрию.
https://slicker.me/javascript/tunnel/tunnel_run.htm
Реализация игры в которой нужно бегать и прыгать через туннель. Отображение двумерной сетки как трёхмерного туннеля с помощью функций sin и cos вместе с перспективным масштабированием. Простое объяснение реализации без углубления в тригонометрию.
https://slicker.me/javascript/tunnel/tunnel_run.htm
👍8❤🔥2🔥2🥴1
Прошел тест от Спортмастера – оказывается, я не умею совмещать работу и жизнь. А какой результат у вас?
🆖 перейти в бота
Please open Telegram to view this post
VIEW IN TELEGRAM
💩8👍4🤣2
WelsonJS — cоздание Windows приложений на JavaScript
WelsonJS — фреймворк для создания Windows‑приложений на встроенном в систему JavaScript‑движке, позволяющий писать полноценные десктоп‑программы (GUI, консоль, автоматизация Office) с HTML/CSS и JS/TS без Node.js
Проект предоставляет для сборки и установки собственный HTA/скриптовый лаунчер и Inno Setup инсталлятор.
https://github.com/gnh1201/welsonjs
WelsonJS — фреймворк для создания Windows‑приложений на встроенном в систему JavaScript‑движке, позволяющий писать полноценные десктоп‑программы (GUI, консоль, автоматизация Office) с HTML/CSS и JS/TS без Node.js
Проект предоставляет для сборки и установки собственный HTA/скриптовый лаунчер и Inno Setup инсталлятор.
https://github.com/gnh1201/welsonjs
❤12🤯6🔥3
Цветовые функции в CSS
О новых возможностях работы с цветами в CSS с помощью функции color(), позволяющей использовать разные цветовые пространства — от sRGB до CIELAB и Oklab.
https://css-tricks.com/css-color-functions/
О новых возможностях работы с цветами в CSS с помощью функции color(), позволяющей использовать разные цветовые пространства — от sRGB до CIELAB и Oklab.
https://css-tricks.com/css-color-functions/
❤8🔥5👍1
Новая возможность CSS — gap decorations
Стилизация промежутков между элементами в макетах flex, grid и колонках с использованием свойств наподобие column-rule и row-rule, избавляя от костылей с псевдоэлементами и лишней вёрстки. Поддерживается в Chrome начиная с 139 версии.
https://developer.chrome.com/blog/gap-decorations
Стилизация промежутков между элементами в макетах flex, grid и колонках с использованием свойств наподобие column-rule и row-rule, избавляя от костылей с псевдоэлементами и лишней вёрстки. Поддерживается в Chrome начиная с 139 версии.
https://developer.chrome.com/blog/gap-decorations
🔥14❤3👍3❤🔥2💔1
У вас есть шанс освоить профессию с нуля и работать с современными технологиями!
Реклама. ООО «Отус онлайн-образование», ОГРН 1177746618576, www.otus.ru
Please open Telegram to view this post
VIEW IN TELEGRAM
👍4
Создаем приложение с использованием Refine
Пошаговый тутораил по разработке фуллстек приложения с CRUD операциями и аутентификацией на фреймворке Refine.
https://www.youtube.com/watch?v=k4lHXIzCEkM&ab_channel=JavaScriptMastery
Пошаговый тутораил по разработке фуллстек приложения с CRUD операциями и аутентификацией на фреймворке Refine.
https://www.youtube.com/watch?v=k4lHXIzCEkM&ab_channel=JavaScriptMastery
👍5⚡1❤1
Эти CSS техники устарели
О привычных CSS решениях, которые работают и используются, но которые можно смело заменить более простыми, удобными и современными.
https://habr.com/ru/companies/ruvds/articles/917204/
О привычных CSS решениях, которые работают и используются, но которые можно смело заменить более простыми, удобными и современными.
https://habr.com/ru/companies/ruvds/articles/917204/
🔥12👎7❤2💩1
Создаем Танграм пазл на CSS
Как при помощи SCSS создать интерактивный танграм‑пазл — набор геометрических фигур, которые можно свободно перемещать и поворачивать. Реализация логики «перетаскивания» и поворота блоков с помощью CSS‑трансформаций и переменных + организация адаптивной верстки и плавных анимаций с минимальным использованием JavaScript.
https://css-tricks.com/breaking-boundaries-building-a-tangram-puzzle-with-scss/
Как при помощи SCSS создать интерактивный танграм‑пазл — набор геометрических фигур, которые можно свободно перемещать и поворачивать. Реализация логики «перетаскивания» и поворота блоков с помощью CSS‑трансформаций и переменных + организация адаптивной верстки и плавных анимаций с минимальным использованием JavaScript.
https://css-tricks.com/breaking-boundaries-building-a-tangram-puzzle-with-scss/
🔥9⚡2❤2
🚴♂️Не надо изобретать велосипед
Главная ошибка стартаперов — пытаться сделать идеальный продукт, годами его дорабатывать, но так и не выпустить.
В своём канале я запустил челлендж: 12 проектов за 12 месяцев.
1️⃣ Ищем идею под существующий спрос (не из головы!)
2️⃣ Разрабатываем продукт
3️⃣ Занимаемся бесплатным продвижением
4️⃣ Оптимизируем и масштабируем
Формула проста:
1 запуск = 1 функция = решение 1 проблемы
Три главных правила:
✔️ Только проверенный спрос — через поисковые запросы, а не догадки.
✔️ Быстрый запуск — никакого перфекционизма.
✔️ Только США и ЕС — там платят за удобство.
Также в канале разбираю:
— Кто и зачем будет платить за микро-продукт?
— Главная ошибка начинающих стартаперов
— Микро-продукт vs стартап
— Как бесплатно продвигать продукт
Короче, рассказываю в канале без купюр: что работает, а что нет, сколько приносит и как продвигаем. Всё, что обычно скрывают.
Реклама: ИП Зуев Игорь Владимирович, ИНН: 360408359441, Erid: 2VtzqxL27QA
Главная ошибка стартаперов — пытаться сделать идеальный продукт, годами его дорабатывать, но так и не выпустить.
В своём канале я запустил челлендж: 12 проектов за 12 месяцев.
1️⃣ Ищем идею под существующий спрос (не из головы!)
2️⃣ Разрабатываем продукт
3️⃣ Занимаемся бесплатным продвижением
4️⃣ Оптимизируем и масштабируем
Формула проста:
1 запуск = 1 функция = решение 1 проблемы
Три главных правила:
✔️ Только проверенный спрос — через поисковые запросы, а не догадки.
✔️ Быстрый запуск — никакого перфекционизма.
✔️ Только США и ЕС — там платят за удобство.
Также в канале разбираю:
— Кто и зачем будет платить за микро-продукт?
— Главная ошибка начинающих стартаперов
— Микро-продукт vs стартап
— Как бесплатно продвигать продукт
Короче, рассказываю в канале без купюр: что работает, а что нет, сколько приносит и как продвигаем. Всё, что обычно скрывают.
Реклама: ИП Зуев Игорь Владимирович, ИНН: 360408359441, Erid: 2VtzqxL27QA
💯4❤2🔥1🤡1
Облегчаем использование регулярных выражений в JS
Несколько советов, которые сделают вашу работу с регулярками проще и удобнее.
https://2ality.com/2025/06/javascript-regexp-tips.html
Несколько советов, которые сделают вашу работу с регулярками проще и удобнее.
https://2ality.com/2025/06/javascript-regexp-tips.html
🔥8👍4❤3🥴2
Как оптимизировать работу вашего NextJs приложения с after
О новой API-функции
https://blog.logrocket.com/how-to-optimize-next-js-app-after/
О новой API-функции
after()
в Next.js 15, которая позволяет выполнять дополнительную логику после отправки ответа клиенту, не замедляя основной рендеринг. О том, где и как применять after()
, а также потенциальные ограничения при работе с Server Components и middleware.https://blog.logrocket.com/how-to-optimize-next-js-app-after/
❤🔥8👍4❤1🌭1
Пропали на неделю, сори.
Инспектор HTML форм
Инструмент, делающий разбор вашей формы на предмет ошибок и недочетов - вставляете код и получаете отчет.
https://polypane.app/form-inspector/
Инспектор HTML форм
Инструмент, делающий разбор вашей формы на предмет ошибок и недочетов - вставляете код и получаете отчет.
https://polypane.app/form-inspector/
👍11🍌4🔥3
Params Editor
Удобное расширение для Chrome для редактирования query параметров url
https://params-editor.isolpro.in/
Удобное расширение для Chrome для редактирования query параметров url
https://params-editor.isolpro.in/
👍7😢3🔥2
Новшества EcmaScript 2025
Улучшения для Set, методы итераторов, дублирующиеся именованные группы захвата регулярных выражений, Promise.try() и новый тип Float16Array.
https://pawelgrzybek.com/whats-new-in-ecmascript-2025/
Улучшения для Set, методы итераторов, дублирующиеся именованные группы захвата регулярных выражений, Promise.try() и новый тип Float16Array.
https://pawelgrzybek.com/whats-new-in-ecmascript-2025/
👍5🔥4❤🔥1⚡1
Стилизуем gap
О новой CSS-функциональности — gap decorations, которая позволяет добавлять декоративные разделительные линии между элементами flex, grid и multi-column без лишнего HTML-кода. Теперь можно одним CSS-свойством настроить ширину, цвет, стиль линий и даже сложные шаблоны через repeat(). Поддержка с Chrome 139.
https://css-tricks.com/the-gap-strikes-back-now-stylable/
О новой CSS-функциональности — gap decorations, которая позволяет добавлять декоративные разделительные линии между элементами flex, grid и multi-column без лишнего HTML-кода. Теперь можно одним CSS-свойством настроить ширину, цвет, стиль линий и даже сложные шаблоны через repeat(). Поддержка с Chrome 139.
https://css-tricks.com/the-gap-strikes-back-now-stylable/
👍6❤2❤🔥1🔥1
This media is not supported in your browser
VIEW IN TELEGRAM
🎯 Хочешь запустить своё мини-приложение на аудиторию в 45 млн пользователей?
VK Dev Grants — грантовая программа для разработчиков от VK Mini Apps
🏆 Призовой фонд — 5 млн ₽
💡 Условия — от идеи до масштабного релиза
💼 Участие — соло или в команде
🧠 Экспертная поддержка, продвижение и монетизация
Заявки на 1 этап принимаются до 31 июля. Для участия потребуется презентация проекта с подробным описанием идеи мини-приложения и всем, что может лечь в основу проекта.
👉 Подать заявку.
VK Dev Grants — грантовая программа для разработчиков от VK Mini Apps
🏆 Призовой фонд — 5 млн ₽
💡 Условия — от идеи до масштабного релиза
💼 Участие — соло или в команде
🧠 Экспертная поддержка, продвижение и монетизация
Заявки на 1 этап принимаются до 31 июля. Для участия потребуется презентация проекта с подробным описанием идеи мини-приложения и всем, что может лечь в основу проекта.
👉 Подать заявку.
👎5👍4
Вертикальный ритм
Почему вертикальный ритм важен и как его соблюсти при дизайне и разработке приложений.
https://habr.com/ru/companies/edison/articles/340670/
Почему вертикальный ритм важен и как его соблюсти при дизайне и разработке приложений.
https://habr.com/ru/companies/edison/articles/340670/
👍8❤3❤🔥1🔥1
Оператор satisfies в TypeScript
Подробнее об операторе satisfies, который позволяет проверить, соответствует ли объект определённому типу. Полезно для случаев, когда нужно сохранить узкие типы значений и одновременно гарантировать соответствие интерфейсу. Благодаря satisfies улучшается безопасность типов, автодополнение и общая надёжность кода, по сравнению с использованием as.
https://frontendmasters.com/blog/satisfies-in-typescript/
Подробнее об операторе satisfies, который позволяет проверить, соответствует ли объект определённому типу. Полезно для случаев, когда нужно сохранить узкие типы значений и одновременно гарантировать соответствие интерфейсу. Благодаря satisfies улучшается безопасность типов, автодополнение и общая надёжность кода, по сравнению с использованием as.
https://frontendmasters.com/blog/satisfies-in-typescript/
❤🔥7🔥4❤3
Анализ 100 лендинг страниц продуктов для разработчиков
Представим, что у вас есть инструмент для разработчиков и вы хотите его продвигать. Какую лендинг страницу сделать? Вот обзорная статья от Злых Марсиан с успешными практиками для дизайна лендингов: понятные заголовки, визуальные демо продукта и чёткие призывы к действию.
https://evilmartians.com/chronicles/we-studied-100-devtool-landing-pages-here-is-what-actually-works-in-2025
Представим, что у вас есть инструмент для разработчиков и вы хотите его продвигать. Какую лендинг страницу сделать? Вот обзорная статья от Злых Марсиан с успешными практиками для дизайна лендингов: понятные заголовки, визуальные демо продукта и чёткие призывы к действию.
https://evilmartians.com/chronicles/we-studied-100-devtool-landing-pages-here-is-what-actually-works-in-2025
👍8🤣3❤1👨💻1