This media is not supported in your browser
VIEW IN TELEGRAM
Посмотреть всё можно здесь: https://langsagne.vercel.app/
@WebDev_Plus
Please open Telegram to view this post
VIEW IN TELEGRAM
Привет, разработчики Laravel
Работа с адресами, локациями и геопозициями — ключевая часть современных веб-приложений.
Недавно я наткнулся на пакет для Laravel, который сразу поддерживает большинство этих фич, что может существенно ускорить разработку.
Возможности пакета:
- Добавление связей для адресов доставки и биллинга к любой модели Eloquent
- Возможность отмечать определённый адрес как основной
- Поиск адресов в заданном радиусе
Рекомендую попробовать и поделиться своим опытом.
#laravel #php
@WebDev_Plus
Работа с адресами, локациями и геопозициями — ключевая часть современных веб-приложений.
Недавно я наткнулся на пакет для Laravel, который сразу поддерживает большинство этих фич, что может существенно ускорить разработку.
Возможности пакета:
- Добавление связей для адресов доставки и биллинга к любой модели Eloquent
- Возможность отмечать определённый адрес как основной
- Поиск адресов в заданном радиусе
Рекомендую попробовать и поделиться своим опытом.
#laravel #php
@WebDev_Plus
Mapped types + generic indexing в TypeScript
Форма вашего payload привязана к имени события.
Обратились к неправильному полю внутри обработчика? Ошибка компиляции. 👇
#TypeScript
Форма вашего payload привязана к имени события.
Обратились к неправильному полю внутри обработчика? Ошибка компиляции. 👇
#TypeScript
Привет, разработчики Laravel
Все мы рады новым релизам фреймворка Laravel.
Но что если хочется опробовать изменения до официального релиза?
Не переживайте! В вашем
Это установит последнюю версию фреймворка с всех последних коммитов ветки 13.x, позволяя попробовать новые возможности заранее.
Важно: не коммитьте это и не используйте в продакшене — ветка может быть нестабильной до официального релиза.
#laravel #php
@WebDev_Plus
Все мы рады новым релизам фреймворка Laravel.
Но что если хочется опробовать изменения до официального релиза?
Не переживайте! В вашем
composer.json, в секции require, просто замените версию laravel/framework на 13.x-dev и выполните composer update.Это установит последнюю версию фреймворка с всех последних коммитов ветки 13.x, позволяя попробовать новые возможности заранее.
Важно: не коммитьте это и не используйте в продакшене — ветка может быть нестабильной до официального релиза.
#laravel #php
@WebDev_Plus
Руководство по современному вебу теперь в раннем превью.
ИИ-агенты для кодинга часто опираются на устаревшие паттерны, из-за чего получается перегруженный JavaScript. Google Chrome и Microsoft Edge совместно работают над тем, чтобы это исправить — помогая ИИ генерировать более чистый и современный код с использованием актуальных возможностей платформы. Итог — более качественные веб-приложения для всей экосистемы веба.
Публичный репозиторий: https://github.com/GoogleChrome/modern-web-guidance
@WebDev_Plus
ИИ-агенты для кодинга часто опираются на устаревшие паттерны, из-за чего получается перегруженный JavaScript. Google Chrome и Microsoft Edge совместно работают над тем, чтобы это исправить — помогая ИИ генерировать более чистый и современный код с использованием актуальных возможностей платформы. Итог — более качественные веб-приложения для всей экосистемы веба.
Публичный репозиторий: https://github.com/GoogleChrome/modern-web-guidance
@WebDev_Plus
GitHub
GitHub - GoogleChrome/modern-web-guidance
Contribute to GoogleChrome/modern-web-guidance development by creating an account on GitHub.
👍1
Напоминание: использовать
Функция широко доступна с марта 2022 года.
@WebDev_Plus
structuredClone вместо связки JSON.parse / JSON.stringify.Функция широко доступна с марта 2022 года.
@WebDev_Plus
👍1
🤔 Говорили, что CSS — это просто стилизация
Тем временем CSS с
@WebDev_Plus
Тем временем CSS с
:where() и :has() уже выглядит как SQL-запросы.@WebDev_Plus
👍3😁2
Сопоставленные типы и обобщённая индексация в TypeScript
Форма payload привязана к имени события.
Обратился не к тому полю внутри обработчика — получил ошибку компиляции.
#TypeScript
@WebDev_Plus
Форма payload привязана к имени события.
Обратился не к тому полю внутри обработчика — получил ошибку компиляции.
#TypeScript
@WebDev_Plus
Знаете, что в языке JavaScript можно писать тесты прямо в исходниках
Rstest поддерживает тесты прямо в коде — тесты пишутся рядом с реализацией. При сборке для продакшена тестовый код вырезается. Нулевые издержки на бандл.
Подход в стиле Раста для удобства разработки, теперь в тулчейне JavaScript🦀
https://rstest.rs/config/test/include-source
#JavaScript #Rstest #Rspack
@WebDev_Plus
Rstest поддерживает тесты прямо в коде — тесты пишутся рядом с реализацией. При сборке для продакшена тестовый код вырезается. Нулевые издержки на бандл.
Подход в стиле Раста для удобства разработки, теперь в тулчейне JavaScript
https://rstest.rs/config/test/include-source
#JavaScript #Rstest #Rspack
@WebDev_Plus
Please open Telegram to view this post
VIEW IN TELEGRAM
This media is not supported in your browser
VIEW IN TELEGRAM
Жёсткая графическая библиотека для твоего веба 😘
Кастомизируемая, цепляющая и простая в использовании.
✓ компоненты “скопировал-вставил”
✓ React + Tailwind
→ rosencharts.com
@WebDev_Plus
Кастомизируемая, цепляющая и простая в использовании.
✓ компоненты “скопировал-вставил”
✓ React + Tailwind
→ rosencharts.com
@WebDev_Plus
Please open Telegram to view this post
VIEW IN TELEGRAM
👍1
This media is not supported in your browser
VIEW IN TELEGRAM
Рад, что наконец появился markdown-редактор для React, который реально ощущается как отполированный 🔥
MDXEditor — редактор в стиле Notion с поддержкой расширенного markdown, MDX, JSX, таблиц, блоков кода и многого другого.
→ современный опыт редактирования rich-text
→ высоко настраиваемая система плагинов
→ создан для React и MDX-workflow
→ плавный и удобный для разработчиков
Идеально подходит для создания документации, блогов, CMS-платформ и инструментов для написания текста :))
github.com/mdx-editor/editor
@WebDev_Plus
MDXEditor — редактор в стиле Notion с поддержкой расширенного markdown, MDX, JSX, таблиц, блоков кода и многого другого.
→ современный опыт редактирования rich-text
→ высоко настраиваемая система плагинов
→ создан для React и MDX-workflow
→ плавный и удобный для разработчиков
Идеально подходит для создания документации, блогов, CMS-платформ и инструментов для написания текста :))
github.com/mdx-editor/editor
@WebDev_Plus
Please open Telegram to view this post
VIEW IN TELEGRAM
❤1
This media is not supported in your browser
VIEW IN TELEGRAM
Бро… хватит вручную писать скелетон лоадеры 🦴
Этот опенсорс веб-компонентс автоматически генерирует скелетоны лоадера из твоего реального UI с множеством настроек.
→ не нужны отдельные skeleton-компоненты
→ генерирует лоадеры из реальной DOM-структуры
→ настраиваемый shimmer-эффект и стили
→ работает с React, Vue, Svelte и другими
Твой реальный UI автоматически превращается в загрузочный skeleton :)
github.com/Aejkatappaja/phantom-ui
@WebDev_Plus
Этот опенсорс веб-компонентс автоматически генерирует скелетоны лоадера из твоего реального UI с множеством настроек.
→ не нужны отдельные skeleton-компоненты
→ генерирует лоадеры из реальной DOM-структуры
→ настраиваемый shimmer-эффект и стили
→ работает с React, Vue, Svelte и другими
Твой реальный UI автоматически превращается в загрузочный skeleton :)
github.com/Aejkatappaja/phantom-ui
@WebDev_Plus
Please open Telegram to view this post
VIEW IN TELEGRAM
Изучите Clean Architecture, применённую к фронтенду
✓ Использует use case’ы, сервисы и репозитории
✓ Как организованы разные слои
✓ Без классов — всё на функциях
✓ Реализовано на TypeScript
https://dev.to/bespoyasov/clean-architecture-on-frontend-4311
@WebDev_Plus
✓ Использует use case’ы, сервисы и репозитории
✓ Как организованы разные слои
✓ Без классов — всё на функциях
✓ Реализовано на TypeScript
https://dev.to/bespoyasov/clean-architecture-on-frontend-4311
@WebDev_Plus
❤2
This media is not supported in your browser
VIEW IN TELEGRAM
Вау, это реально DOM 🤭
(Смотрите, я использую Chrome DevTools, чтобы инспектировать DOM)
HTML превращается в
ИСТОЧНИК
@WebDev_Plus
(Смотрите, я использую Chrome DevTools, чтобы инспектировать DOM)
HTML превращается в
<canvas> — это откроет новую эру веб-интерфейсовИСТОЧНИК
@WebDev_Plus
Please open Telegram to view this post
VIEW IN TELEGRAM
- Отключите автообновление расширений в VS Code, Cursor и других форках
(macOS:
Cmd + Shift + P → Disable Auto Updating Extensions)- Используйте статический анализатор zizmor для GitHub Actions, чтобы выявлять потенциальные проблемы безопасности
- Используйте actions-up для обновления GitHub Actions до актуальных версий с SHA-pinning
- Добавьте Socket Free Firewall или safe-chain при установке npm-пакетов, чтобы снизить риски атак через цепочку поставок (supply chain attacks)
@WebDev_Plus
Please open Telegram to view this post
VIEW IN TELEGRAM
GitHub
GitHub - zizmorcore/zizmor: Static analysis for GitHub Actions
Static analysis for GitHub Actions. Contribute to zizmorcore/zizmor development by creating an account on GitHub.
Они только что превратили Claude Code, Codex и Cursor в настоящего senior-разработчика.
Причём бесплатно.
Называется это Superpowers, и проект уже набрал 204 000 звёзд на GitHub.
Проблема агентных инструментов на достаточно крупных проектах всегда одна и та же:
- Они сразу лезут в код
- Отлаживают всё вслепую
- Игнорируют тесты
- А по мере роста проекта начинают галлюцинировать
Superpowers решает эту проблему, навязывая процесс работы senior-инженера:
→ Сначала брейншторминг, и только потом написание кода
→ Строгий TDD (Red → Green) без исключений — если теста нет, код удаляется
→ Параллельная работа через субагентов в изолированных Git worktree
→ Контекст остаётся под контролем даже во время многочасовой автономной работы
Теперь процесс выглядит не как:
Промпт → Код → Молиться
а как:
Brainstorm → Spec → Plan → TDD → Subagents → Review → Ship
Ни строчки кода до появления проходящих тестов.
Поддерживаются Claude Code, Codex, Cursor, Gemini CLI, OpenCode и Copilot CLI.
Полностью Open Source.
Лицензия MIT.
Теперь вам не нужно писать промпты вслепую.
Ваш агент работает как senior-разработчик.
@WebDev_Plus
Причём бесплатно.
Называется это Superpowers, и проект уже набрал 204 000 звёзд на GitHub.
Проблема агентных инструментов на достаточно крупных проектах всегда одна и та же:
- Они сразу лезут в код
- Отлаживают всё вслепую
- Игнорируют тесты
- А по мере роста проекта начинают галлюцинировать
Superpowers решает эту проблему, навязывая процесс работы senior-инженера:
→ Сначала брейншторминг, и только потом написание кода
→ Строгий TDD (Red → Green) без исключений — если теста нет, код удаляется
→ Параллельная работа через субагентов в изолированных Git worktree
→ Контекст остаётся под контролем даже во время многочасовой автономной работы
Теперь процесс выглядит не как:
Промпт → Код → Молиться
а как:
Brainstorm → Spec → Plan → TDD → Subagents → Review → Ship
Ни строчки кода до появления проходящих тестов.
Поддерживаются Claude Code, Codex, Cursor, Gemini CLI, OpenCode и Copilot CLI.
Полностью Open Source.
Лицензия MIT.
Теперь вам не нужно писать промпты вслепую.
Ваш агент работает как senior-разработчик.
@WebDev_Plus
GitHub
GitHub - obra/superpowers: An agentic skills framework & software development methodology that works.
An agentic skills framework & software development methodology that works. - obra/superpowers
Если хотите изучить Python, SQL или Machine Learning, у Kaggle есть бесплатные курсы с сертификатами.
Самое приятное — они сразу переходят к сути и подходят для обучения с нуля. Материал объясняется без предположения, что у вас уже есть какой-то опыт. Отличный вариант для старта.
Каждый курс занимает всего несколько часов. Благодаря этому можно быстро освоить новую тему без серьёзных временных затрат.
Найти их можно на сайте Kaggle в разделе Learn.
https://www.kaggle.com/
@WebDev_Plus
Самое приятное — они сразу переходят к сути и подходят для обучения с нуля. Материал объясняется без предположения, что у вас уже есть какой-то опыт. Отличный вариант для старта.
Каждый курс занимает всего несколько часов. Благодаря этому можно быстро освоить новую тему без серьёзных временных затрат.
Найти их можно на сайте Kaggle в разделе Learn.
https://www.kaggle.com/
@WebDev_Plus
Кто-то выложил в open source библиотеку со всеми тех-логотипами, которые вам когда-либо могли понадобиться — в виде чистых, оптимизированных SVG.
Называется developer-icons. Вот что в ней есть:
→ 200+ логотипов технологий (React, HTML, JS, Docker и другие) в виде полноценных компонентов
→ гибкая настройка размера, цвета и толщины stroke для каждой иконки
→ масштабирование под любое разрешение без потери качества
→ встроенные light/dark и wordmark-варианты
→ поддержка tree-shaking — в bundle попадут только импортированные иконки
Больше не нужно копаться в Figma-экспортах или вставлять случайные SVG, найденные на Stack Overflow.
Полностью open source. Лицензия MIT. 2.1k звёзд.
@WebDev_Plus
Называется developer-icons. Вот что в ней есть:
→ 200+ логотипов технологий (React, HTML, JS, Docker и другие) в виде полноценных компонентов
→ гибкая настройка размера, цвета и толщины stroke для каждой иконки
→ масштабирование под любое разрешение без потери качества
→ встроенные light/dark и wordmark-варианты
→ поддержка tree-shaking — в bundle попадут только импортированные иконки
Больше не нужно копаться в Figma-экспортах или вставлять случайные SVG, найденные на Stack Overflow.
npm i developer-icons — импортируете иконку, вставляете в JSX, и готово.Полностью open source. Лицензия MIT. 2.1k звёзд.
@WebDev_Plus
❤🔥1
#Laravel Tip
А вы знали, что Laravel понимает ваши связи между моделями и позволяет писать код намного чище 👇
@WebDev_Plus
А вы знали, что Laravel понимает ваши связи между моделями и позволяет писать код намного чище 👇
@WebDev_Plus
👍1
Как frontend-разработчику вырасти в ЗП?
День сурка frontend-разработчика выглядит так
Зарплата замерла, задачи — бесконечный повтор, растет только кол-во бессмысленных созвонов
Откликаешься на вакансии — отвечают только ноунеймы, на собесах закидывают странными алгоритмами «на скорость».
И самое бесящее — пока буксуешь, кто-то вокруг спокойно забирает офферы в Яндекс и VK...
👋 Меня зовут Тихон, привет! Я — действующий Frontend-разработчик и ментор. Я за руку довожу до оффера на хорошую позицию в Big Tech и сопровождаю на испытательном сроке.
В своем канале:
👉Объясняю, как проходить HR-фильтр и превращать отклики в реальные приглашения
👉Помогаю найти мотивацию, борюсь убеждениями, которые мешают развиваться
👉На примерах объясняю, как проходить собеседования, включая техничку
👉Разбираю резюме и делюсь лайфхаками, например как аккуратно “пинговать” рекрутеров
А еще регулярно публикую полезные материалы:
▪️Задачи, на которых валяться кандидаты
▪️База по микрофронтам
▪️Подборка из 100+ каналов с вакансиями для разработчиков
▪️100 вопросов, которые точно помогут тебе на собеседовании
▪️Чек лист проверки своего резюме
А еще у меня множество успешных кейсов и трогательных отзывов, найти их можно в канале.
Реклама, erid: 2W5zFGrysSZ ИП Галактионов Тихон Витальевич, ИНН 771618975809
День сурка frontend-разработчика выглядит так
Зарплата замерла, задачи — бесконечный повтор, растет только кол-во бессмысленных созвонов
Откликаешься на вакансии — отвечают только ноунеймы, на собесах закидывают странными алгоритмами «на скорость».
И самое бесящее — пока буксуешь, кто-то вокруг спокойно забирает офферы в Яндекс и VK...
Ты тоже можешь получить оффер в компанию, в которой тебя будут ценить и хорошо платить.
👋 Меня зовут Тихон, привет! Я — действующий Frontend-разработчик и ментор. Я за руку довожу до оффера на хорошую позицию в Big Tech и сопровождаю на испытательном сроке.
В своем канале:
👉Объясняю, как проходить HR-фильтр и превращать отклики в реальные приглашения
👉Помогаю найти мотивацию, борюсь убеждениями, которые мешают развиваться
👉На примерах объясняю, как проходить собеседования, включая техничку
👉Разбираю резюме и делюсь лайфхаками, например как аккуратно “пинговать” рекрутеров
А еще регулярно публикую полезные материалы:
▪️Задачи, на которых валяться кандидаты
▪️База по микрофронтам
▪️Подборка из 100+ каналов с вакансиями для разработчиков
▪️100 вопросов, которые точно помогут тебе на собеседовании
▪️Чек лист проверки своего резюме
А еще у меня множество успешных кейсов и трогательных отзывов, найти их можно в канале.
Реклама, erid: 2W5zFGrysSZ ИП Галактионов Тихон Витальевич, ИНН 771618975809