Vue. Пути улучшения возможностей повторного использования ваших компонентов

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

Но повторное использование можно (и даже оптимальнее) осуществлять за счет других подходов. Набор приемов куда как более велик. Предлагаю вам поразмышлять на эту тему вместе с автором в нескольких статьях.

Читать далее

Как создать закадровый перевод для видео-уроков на иностранном языке

Думаю, никто не будет спорить, что разработчику непрерывно надо получать новые знания. Хорошо, когда необходимая информация разобрана в книге или статье. Но в последнее время большой пласт информации находится в видеороликах. Это могут быть как ролики на известных видео-хостингах, так и на сайтах с обучающими курсами. Не смотря на то, что воспринимать разбор кода в таком виде не совсем удобно количество таких видео все растет. Те, кто ранее писал статьи в блогах, сейчас чаще и чаще выкладывают видео-сообщения вместо этого. Проблему усложняет тот факт, что больше всего информации в сети на английском языке, а понимать на слух беглую иностранную речь не так то просто научиться (читать куда как проще). Но также в наше дни есть и инструменты, которые позволяют сделать прекрасный перевод и наложить его на видео. Об одном таком, который оказался бесплатным и невероятно удобным и пойдет речь в этой статье.

Читать далее

Vuex или Pinia. Что выбрать?

Сложно представить себе Vue-приложение, которое состоит из 1-2 компонентов. Обычно у нас есть десятки и даже сотни строительных блоков. Компоненты складываются в иерархическую структуру. Основной способ передать какие-либо данные с верхних уровней элементов к нижним – свойства компонентов. Для передачи чего-либо в обратном направлении обычно служат события. Однако, если какие-либо данные необходимо передавать через несколько уровней вложенности, то такой подход будет очень трудоемким. Скорее всего также, часть компонентов на пути передачи данных будут в этом лишь посредниками. То есть они будут получать данные, которые им самим не нужны. И это нарушает принципы SOLID. Такой подход станет еще более обременительным, если данные нужно передавать между соседними ветками иерархии.

Читать далее

VueUse

VueUse – это коллекция утилит для Vue Composition API, которая содержит средства для взаимодействия с различными сенсорами, API состояния, анимацией и другими возможностями браузеров. Помимо этого, также, включает в себя ряд интеграций со сторонними популярными пакетами.

Читать далее

TanStack Query (Vue Query)

При создании сложного приложения на Vue.js на ряде страниц (в ряде компонентов) могут понадобиться общие для части проекта данные. При этом они не настолько общие и часто употребимые, чтобы загружать их сразу при обращении к любой странице. Хорошо бы загрузить эти данные сразу при посещении одной из тех страниц, где они нужны. И далее хранить с возможностью использовать на других страницах без повторной загрузки.

Читать далее

Книга Amit D. Merchant “PHP 8 in a Nutshell”

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

Читать далее

Laravel Pipelines

Laravel Pipelines – одна из малоизвестных возможностей Laravel. Ее описание не встретишь в документации Laravel. Однако внутри фреймворка данный инструментарий используется довольно часто. В этой статье будет коротко рассказано о том, в каких случаях может быть полезен подход Laravel Pipelines, а также даны некоторые подробности применения и полезные ссылки.

Читать далее

Книга Carl Rippon “Learn React with TypeScript”

Как разработчик, имеющий опыт работы с фреймворком Vue.js, не мог игнорировать славу React и решил попробовать что из себя представляет экосистема этой библиотеки. Стал искать путь получить необходимую и наиболее актуальную информацию по работе с React. В настоящее время есть различные способы получить новые знания в области разработки программного обеспечения. Создание web-приложений на React, конечно же, – не исключение.

Читать далее

Настройка Laravel + React с docker и без

Ранее описывалась настройка docker окружения для проекта на базе Laravel и Vue. В этой статье произведем настройку web-приложения с использованием Laravel в качестве backend-части и React в качестве frontend. Так как кому-то может пригодиться создание такого приложения без docker, то начнем с настройки на машине с PHP 8.1 и NPM 8. Затем тот же код запустим в docker использованием docker compose для управления контейнерами.

Читать далее

Тестирование PHP кода с HTTP запросами к сторонним сервисам

При написании автоматических тестов к PHP приложению могут возникать различные сложности. Одной из таких сложностей может быть зависимость от внешнего сервиса, к которому (используя его API) происходит обращение по HTTP. Конечно делать реальные запросы к сторонним ресурсам в тестах – не выход. Поэтому в определенный момент придется прибегнуть к созданию различных заглушек. В этой статье попробуем собрать различные способы использования заглушек.

Читать далее

Настройка docker для Laravel и Vue на одном домене

Ранее здесь уже описывалась настройка docker для приложения на базе Laravel и Vue с использование поддомена. В том материале backend с Laravel размещался на поддомене, а frontend с Vue – на основном домене. Однако такая конфигурация может иметь свои недостатки (например, проблемы с CORS). В данной статье попробуем настроить для локальной работы такое же окружение, но на одном домене. Чтобы у Laravel работали одни маршруты, а у Vue – другие.

Читать далее

Laravel + Vue в Docker с помощью Sail

Ранее была опубликована статья, вкоторой описывалась настройка fullstack приложения Laravel + Vue с выносом Laravel на поддомен. Vue приложение располагалось на основном домене, а api на Laravel – на поддомене backend.

Но Laravel имеет в своем распоряжении инструмент sail, который позволяет легко настроить docker окружение не прибегая даже, зачастую, к составлению файлов Dockerfile и docker-compose.yml.

Читать далее