👩‍💻 6 основных функций JavaScript, которые должен знать каждый разработчик

JavaScript - универсальный язык, на котором работает большая часть Интернета. Среди множества его возможностей некоторые функции выделяются своей практичностью и оптимизацией производительности. В этой статье мы рассмотрим шесть важнейших функций JavaScript, которые могут расширить инструментарий кодера: Debounce, Throttle, Currying, Memoization, Deep Clone, а также одну бонусную функцию.

🖥 Читать статью (🇬🇧)

📱 @webdev_trends

#webdev #JS #JavaScript

😮 5 лучших сайтов генераторов цветовой палитры в 2024 году

Вы уставились в экран, потягиваете третью чашку кофе и все еще не можете определиться с идеальной цветовой гаммой для очередного шедевра? Не волнуйтесь, любители дизайна и креативные волшебники! Мы прочесали весь интернет, чтобы представить пять лучших сайтов генераторов цветовой палитры, способных превратить творческий хаос в гармоничные оттенки. И знаете что? Мы признали Colorbrew действующим чемпионом.

Давайте окунемся в красочный мир генераторов палитры, которые так же интересны, как и функциональны!

🖥 Читать статью (🇬🇧)

📱 @webdev_trends

#webdev #frontend #design #palette

👩‍💻 Настройка Middleware Auth в Laravel 11

Если вы уже работали с Laravel, то наверняка знакомы с редиректами аутентификации, например, отправляющими гостей на страницу входа в систему или перенаправляющими аутентифицированных пользователей со страниц, на которые они не должны заходить. В Laravel 11 появился новый, более простой способ решения этой проблемы. В этой статье мы рассмотрим, как реализовать новые настройки middleware auth.

🖥 Читать статью (🇬🇧)

📱 @webdev_trends

#webdev #Laravel #Middleware #Auth

👩‍💻 👩‍💻 Создание CLI-приложения с Laravel и Docker

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

Если создаёте проект только для CLI, то можно рассмотреть вариант использования проекта сообщества Laravel Zero. Всё, что обсуждается в этой статье, будет работать с Laravel или Laravel Zero (с некоторыми изменениями в образе Docker).

🖥 Читать статью (🇬🇧)

📱 @webdev_trends

#webdev #Laravel #Docker #CLI

👩‍💻 UseReducer и его отличие от UseState

React предлагает два ключевых хука для управления состоянием: useState и useReducer. Хотя оба предназначены для работы с состоянием в функциональных компонентах, они используются в разных сценариях. В этой статье мы рассмотрим различия между ними и расскажем, когда следует использовать каждый из них, а также приведем примеры для лучшего понимания

🖥 Читать статью (🇬🇧)

📱 @webdev_trends

#webdev #React #hooks

👩‍💻 Как развернуть backend приложение на DigitalOcean используя Docker и Encore

Это руководство рассказывает о том, как развернуть приложение Encore на DigitalOcean с помощью новой команды encore build, входящей в состав открытого CLI Encore.

Это удобно, если вы предпочитаете ручное развертывание автоматизации, предлагаемой облачной платформой Encore. Даже при ручном развертывании Encore упрощает процесс, предоставляя инструменты для сборки и настройки приложения.

Давайте рассмотрим, как развернуть приложение Encore на платформе DigitalOcean App Platform с помощью Docker и encore build.

🖥 Читать статью (🇬🇧)

📱 @webdev_trends

#webdev #Docker #Encore #DigitalOcean

✏️ Ирония статической типизации в динамических языках

Всегда забавно наблюдать за тем, как со временем эволюционируют языки программирования.

Когда-то, когда я начинал свой путь в мире разработки программного обеспечения, динамические языки, такие как Python, PHP и JavaScript, ценились за их гибкость и лаконичный синтаксис, подходящий для быстрой разработки.

Однако по мере развития этих слабо типизированных языков в них стали появляться черты сильно типизированных языков, что сделало их похожими на C++ и Java:

👩‍💻 Python: Возможности подсказки типов, введенные с версии 3.5 в 2015 году и расширенные в версии 3.12 в 2022 году.
👩‍💻 PHP: Объявленные типы появились в версии 7 в 2015 году.
👩‍💻 JavaScript: Расширен выпуском TypeScript в 2012 году, который определяется как «JavaScript с синтаксисом для типов».

🖥 Читать статью (🇬🇧)

📱 @webdev_trends

#webdev #JS #PHP #Python

👩‍💻 Лучшие практики, советы и трюки Laravel в 2025 году

В преддверии 2025 года Laravel продолжает оставаться одним из лучших вариантов для веб-разработки, предлагая разработчикам инструменты для создания мощных и эффективных приложений. В этой статье описаны основные лучшие практики, советы и рекомендации, способные повысить качество кода и оптимизировать рабочий процесс, независимо от того, используете ли вы Laravel 9, 10 или 11. Эти советы помогут максимально использовать возможности Laravel и улучшить навыки разработки, независимо от того, являетесь ли вы начинающим или опытным разработчиком.

🖥 Читать статью (🇬🇧)

📱 @webdev_trends

#webdev #Laravel #tips

👩‍💻 20 TypeScript Tricks Every Developer Should Know 🚀

TypeScript - мощный инструмент для современной разработки JavaScript, обеспечивающий безопасность типов и предоставляющий расширенные возможности.
Хотя многие разработчики знают основы, существуют скрытые жемчужины и практические трюки, которые могут сделать код более эффективным, чистым и удобным для сопровождения.
Давайте рассмотрим 20 трюков TypeScript, которые должен знать каждый разработчик, с примерами и практическими подходами! 💻

🖥 Читать статью (🇬🇧)

📱 @webdev_trends

#webdev #TypeScript #TS #tips

👩‍💻 Понимание пропсов в React: Подробное руководство

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

🖥 Читать статью (🇬🇧)

📱 @webdev_trends

#webdev #React #Props

👩‍💻 Как перенести устаревший PHP код в объектно-ориентированную структуру с помощью PDO

Перенос устаревшего PHP-кода на современный объектно-ориентированный подход не только повышает читаемость и удобство сопровождения кода, но и улучшает безопасность и масштабируемость. Сочетая принципы объектно-ориентированного программирования (ООП) с PHP Data Objects (PDO) для взаимодействия с базами данных, разработчики могут создавать более эффективные, безопасные и многократно используемые приложения. Переход от процедурного кода к ООП с PDO может показаться сложным, но при правильном подходе и использовании лучших практик этот процесс становится управляемым и целесообразным.

В этой статье мы рассмотрим основные шаги и лучшие практики для преобразования устаревшего PHP-кода в объектно-ориентированную структуру с помощью PDO, включая стратегии проектирования классов, обработки операций с базой данных и поддержания организации кода.

🖥 Читать статью (🇬🇧)

📱 @webdev_trends

#webdev #PHP #MySQL

👩‍💻 Scroll-Driven... Sections

На днях я просматривал очень круто оформленную статью, полную иллюстраций на основе прокрутки, и, мы, как веб-разработчики, будем навечно прокляты, задался вопросом, что они использовали для её создания. Спойлер: это GSAP и ScrollTrigger.

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

🖥 Читать статью (🇬🇧)

📱 @webdev_trends

#webdev #CSS #ScrollDriven

👩‍💻 Поиск и навигация по Git коммитам

Иногда встречаю код, озадачивающий меня. Когда это случается, я пытаюсь найти коммит, добавивший его. Возможно, код стал таким из-за исправления бага, не очевидного с первого взгляда, а может, есть какое-то ограничение, о котором я не знаю. В любом случае необходимо больше контекста.

Очевидное решение - использовать Git blame для просмотра коммита (и связанного с ним pull request), в который был добавлен код.

В pull request часто есть описание (или ссылка на проблему с описанием), проясняющее изменение, или обсуждения, добавленные во время проверки кода — это очень ценно! Если это не удается, сам коммит часто содержит связанные изменения, обеспечивающие контекст кода.

🖥 Читать статью (🇬🇧)

📱 @webdev_trends

#webdev #Git #Commit

👩‍💻 Умнее, чем 'Ctrl+F': Прямые ссылки на контент веб-страниц

Исторически сложилось так, что можно было ссылаться на определенную часть страницы только в том случае, если эта часть имела ID. Всё, что было нужно сделать, — это поставить ссылку на URL и добавить фрагмент документа (ID). Если хотелось сослаться на определенную часть страницы, нужно было поставить якорь на эту часть, чтобы сослаться на нее. Так было до тех пор, пока не появились Фрагменты текста!

🖥 Читать статью (🇬🇧)

📱 @webdev_trends

#webdev #HTML #Link

👩‍💻 Использование Nodemon для автоматического перезапуска приложений Node.js

Быстрая итерация - ключ к современной веб-разработке, но необходимо останавливать и перезапускать приложения Node.js каждый раз, при внесении изменений в код. Этот процесс может замедлить обновление и отладку, но такие инструменты, как Nodemon, могут улучшить рабочий процесс, как показано в этой статье.

Приложения, написанные на таких языках, как PHP, не нуждаются в перезапуске при обновлении кода. Когда браузер обновляет страницу, он отправляет запрос на веб-сервер, такой, как Apache или NGINX. Сервер анализирует URL, определяет PHP-файл и передает его содержимое интерпретатору среды выполнения PHP. PHP-код выполняется, и сервер получает результат, и передает его обратно браузеру.

В Node.js ваше приложение — это веб-сервер. Запустив node myapp.js, вы загружаете приложение, инициализируете и запускаете сервер, который может отвечать на входящие запросы. Изменение файла не приведет к изменению приложения, потому что в памяти остается предыдущая версия. Чтобы проверить обновление, необходимо остановить работу приложения с помощью Ctrl | Cmd + C, повторно запустить node myapp.js и обновить браузер.

🖥 Читать статью (🇬🇧)

📱 @webdev_trends

#webdev #NodeJS #Nodemon

👩‍💻 Создание компонентов на основе контента с использованием CSS :has(), grid и количественных запросов

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

🖥 Читать статью (🇬🇧)

📱 @webdev_trends

#webdev #CSS #has #Queries

👩‍💻 Как использовать условные типы в TypeScript?

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

🖥 Читать статью (🇬🇧)

📱 @webdev_trends

#webdev #TypeScript #Types

👩‍💻 Антипаттерны контейнеров: Распространенные ошибки Docker и как их избежать.

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

🖥 Читать статью (🇬🇧)

📱 @webdev_trends

#webdev #Docker #Tips

👩‍💻 20 трюков JavaScript, которые должен знать каждый разработчик 🚀

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

🖥 Читать статью (🇬🇧)

📱 @webdev_trends

#webdev #JavaScript #JS #tips

👩‍💻 Пять дорогостоящих ошибок при развёртывании контейнеров Docker (и как их избежать)

Docker - отличный инструмент для развертывания веб-приложений, но только если вы используете его по назначению. Есть много возможностей выстрелить себе в ногу. Поэтому, если хотите избежать мучительных часов отладки, избегайте этих распространенных ошибок.

🖥 Читать статью (🇬🇧)

📱 @webdev_trends

#webdev #Docker #Tips

👩‍💻 Ад обратных вызовов (Callback Hell), написание более чистого асинхронного JavaScript

Если вы работали с JavaScript хоть сколько-нибудь продолжительное время, то, скорее всего, сталкивались с "адом обратных вызовов" - этой запутанной кашей вложенных обратных вызовов, из-за которой код трудно читать и ещё труднее поддерживать. Но есть и хорошие новости: с помощью правильных инструментов и паттернов вы можете полностью избежать ада обратных вызовов и писать чистый, эффективный асинхронный код. Давайте узнаем, как это сделать.

🖥 Читать статью (🇬🇧)

📱 @webdev_trends

#webdev #JS #JavaScript