Angular Vue js React

Работа с формами в Angular — модуль работы с формами и обертки полей.

В статье покажу один из способов работы с формами в Angular-проектах, который упрощает создание новых форм и изолирует зависимость от внешней UI-библиотеки. Будет мало текста и много кода, пристегните ремни, мы начинаем.

Читать далее https://habr.com/ru/companies/tinkoff/articles/740706

Наблюдение за температурой: введение в холодные и горячие Observable в rxjs

По мере изучения RxJS разработчик рано или поздно сталкивается с такими понятиями, как cold и hot observable. А на технических собеседованиях в команды, которые используют RxJS, можно услышать вопросы по этой теме.

Например, чем горячий поток отличается от холодного? Можно ли холодный поток превратить в горячий и наоборот? И если да, то как это сделать?

В статье попробуем разобраться в теме и найти ответы.
https://habr.com/ru/companies/tinkoff/articles/729808/

Angular — шаблон адаптера: упрощение интеграции данных

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

https://javascript.plainenglish.io/angular-adapter-pattern-simplify-data-integration-kanban-board-84f520313a3d

Как сделать Vue.js в 3000 раз быстрее

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

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

https://javascript.plainenglish.io/how-to-make-vue-js-3000-times-faster-826ee04a2491

Макросы настройки скрипта Vue 3

Vue 3 Script Setup — рекомендуемый синтаксис, если вы используете как Single File Components, так и Composition API. Он обеспечивает чистую и лаконичную структуру, которая значительно сокращает шаблонный код.

Основная идея API композиции заключается в том, чтобы явно импортировать каждый помощник , который вам нужно использовать.

https://fadamakis.com/vue-3-script-setup-macros-ab754266363f

Расширение ссылок Vue Router в Vue 3

Тег <router-link>— отличный инструмент для навигации между разными страницами вашего приложения Vue, но это не тот инструмент, который можно использовать при переходе по внешней ссылке, для этого вы захотите использовать обычный <a>тег. Может быть, это только я, но часто я не могу уделить внимание тому, чтобы не отставать от разницы. В других случаях ссылки могут быть динамическими, то есть исходящими из базы данных или какого-либо источника данных, предоставленного пользователем. В таких случаях вы просто не будете знать, является ли ссылка внешней или внутренней, и как сложно было бы делать v-if вручную в каждом месте, где эта ссылка может использоваться.

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

К счастью, расширить <router-link>компонент очень просто, обернув его в свой собственный компонент. Давай сделаем это! Давайте создадим AppLinkкомпонент, который будет обрабатывать любую ссылку, внешнюю ИЛИ внутреннюю.

https://vueschool.io/articles/vuejs-tutorials/extending-vue-router-links-in-vue-3/?source=weeklyVueNews&campaign=ISSUE_ID_PLACEHOLDER

Пользовательская директива всплывающей подсказки в Vuejs 3: Учебник

Пользовательские директивы в Vuejs 3 — это одна из тех вещей, где нет совместимости с предыдущей версией фреймворка.

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

Прежде чем перейти к реализации директивы пользовательской всплывающей подсказки в Vuejs 3, позвольте мне представить основы хорошей стратегии повторного использования кода в Vuejs. https://devdojo.com/inspector/custom-tooltip-directive-in-vuejs-3-tutorial

Зачем и как создавать шину событий в Vuejs 3

Прежде чем вдаваться в подробности этой конкретной реализации, позвольте мне описать принципы взаимодействия компонентов в Vuejs и почему мы решили использовать глобальную шину событий, даже если это не рекомендуется. https://devdojo.com/inspector/why-and-how-to-create-an-event-bus-in-vuejs-3

10 лучших (бесплатных) ресурсов Angular

Возможно, самый мощный JavaScript-фреймворк, Angular требует довольно много времени для обучения. Вот 10 ресурсов для преодоления этого, чтобы вы могли освоить этот зверь фреймворка! https://www.telerik.com/blogs/top-10-free-angular-resources

Три способа раскрыть API внутренних компонентов Vue

Мы все были там, у вас есть компонент с внутренним API (функцией или состоянием), который вы хотите предоставить родительскому компоненту, но с множеством вариантов для этого, какой из них лучше?

Недавно я ответил на вопрос об этом в Твиттере и подумал, что было бы неплохо написать об этом статью. Тем более что в Vue 3 у нас больше возможностей для решения этой проблемы, чем во Vue 2.

https://logaretm.com/blog/three-ways-to-expose-vue-component-api/?source=weeklyVueNews&campaign=ISSUE_ID_PLACEHOLDER

Создание одностраничного приложения с помощью Vue и Kendo UI

SPA — хороший выбор при создании веб-сайта с минимальным набором функций или для обеспечения плавного и отзывчивого взаимодействия с пользователем. Посмотрите, как создать его в стиле Kendo UI для Vue. https://www.telerik.com/blogs/building-single-page-application-vue-kendo-ui

Как создавать диаграммы в Angular с динамическими данными, используя Chart.js

В этой статье я опишу, как отображать динамические данные в виде простых столбчатых, линейных, круговых и кольцевых диаграмм с использованием библиотеки Chart.js и Angular.

https://blog.bitsrc.io/how-to-create-charts-in-angular-with-dynamic-data-using-chart-js-45b9add7715e

Как я структурирую свои приложения Angular

Привет! Я ваш дружелюбный разработчик Angular. Тот, кто всегда возится с кодом, пытаясь сделать все быстрее, лучше и эффективнее. Я несколько раз занимался структурированием приложений Angular, и я здесь, чтобы поделиться с вами тем, что я узнал.

Теперь я не хочу хвастаться, но я видел свою долю плохо структурированных приложений Angular. Вы знаете те, о которых я говорю — они медленные, глючные и совершенно болезненные в работе. Но не бойтесь! С советами и рекомендациями, которыми я собираюсь поделиться, вы сможете структурировать свои приложения Angular как профессионал.

https://medium.com/@dimitarg.stoev/how-i-structure-my-angular-applications-d7d91a2da2e3

Создание лучших форм с помощью Vue.js 3 Composition API: практическое руководство

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

https://digitalpatio.hashnode.dev/build-better-forms-with-vuejs-3-composition-api-a-practical-guide?source=weeklyVueNews&campaign=ISSUE_ID_PLACEHOLDER

Полное руководство NGRX по Angular. Учитесь, выполняя простые операции CRUD

В этой статье я покажу полное руководство о том, как использовать хранилище ngrx с Angular для выполнения основных операций CRUD.

https://itnext.io/ngrx-complete-guide-with-angular-learn-by-doing-simple-crud-operations-95d1414e765d

Раскрытие волшебства: изучение реактивности в различных средах

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

https://www.builder.io/blog/reactivity-across-frameworks

10 распространенных ошибок при разработке Angular

Мы рассмотрим 10 распространенных ошибок с примерами кода, которые разработчики могут допустить при разработке приложений Angular.

https://blog.bitsrc.io/essential-tips-for-successful-angular-development-f92a9ea1d20f

Анонс Vue 3.3

В этом посте представлен обзор выделенных функций в версии 3.3.
https://blog.vuejs.org/posts/vue-3-3