10 распространенных ошибок при разработке Angular
Мы рассмотрим 10 распространенных ошибок с примерами кода, которые разработчики могут допустить при разработке приложений Angular.
https://blog.bitsrc.io/essential-tips-for-successful-angular-development-f92a9ea1d20f
Мы рассмотрим 10 распространенных ошибок с примерами кода, которые разработчики могут допустить при разработке приложений Angular.
https://blog.bitsrc.io/essential-tips-for-successful-angular-development-f92a9ea1d20f
Раскрытие волшебства: изучение реактивности в различных средах
Вы когда-нибудь задумывались, как реактивность работает в вашем любимом фреймворке? Что ж, вам повезло, так как в этой статье мы собираемся глубоко погрузиться в реактивность и сравнить, чем отличаются фреймворки, чтобы лучше понять их.
https://www.builder.io/blog/reactivity-across-frameworks
Вы когда-нибудь задумывались, как реактивность работает в вашем любимом фреймворке? Что ж, вам повезло, так как в этой статье мы собираемся глубоко погрузиться в реактивность и сравнить, чем отличаются фреймворки, чтобы лучше понять их.
https://www.builder.io/blog/reactivity-across-frameworks
Полное руководство NGRX по Angular. Учитесь, выполняя простые операции CRUD
В этой статье я покажу полное руководство о том, как использовать хранилище ngrx с Angular для выполнения основных операций CRUD.
https://itnext.io/ngrx-complete-guide-with-angular-learn-by-doing-simple-crud-operations-95d1414e765d
В этой статье я покажу полное руководство о том, как использовать хранилище ngrx с Angular для выполнения основных операций CRUD.
https://itnext.io/ngrx-complete-guide-with-angular-learn-by-doing-simple-crud-operations-95d1414e765d
Создание лучших форм с помощью 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
Управление большими и сложными формами может стать проблемой для любого веб-разработчика. К счастью, 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
Управление доступом на основе ролей в шаблонах Angular
https://itnext.io/role-based-access-control-in-angular-templates-2eeca497855
https://itnext.io/role-based-access-control-in-angular-templates-2eeca497855
Medium
Role Based Access Control in Angular templates
Are you implementing Role Bases Access Control in Angular templates? One way to do it is via *ngIf, but I would not choose that path, since…
Как я структурирую свои приложения Angular
Привет! Я ваш дружелюбный разработчик Angular. Тот, кто всегда возится с кодом, пытаясь сделать все быстрее, лучше и эффективнее. Я несколько раз занимался структурированием приложений Angular, и я здесь, чтобы поделиться с вами тем, что я узнал.
Теперь я не хочу хвастаться, но я видел свою долю плохо структурированных приложений Angular. Вы знаете те, о которых я говорю — они медленные, глючные и совершенно болезненные в работе. Но не бойтесь! С советами и рекомендациями, которыми я собираюсь поделиться, вы сможете структурировать свои приложения Angular как профессионал.
https://medium.com/@dimitarg.stoev/how-i-structure-my-angular-applications-d7d91a2da2e3
Привет! Я ваш дружелюбный разработчик Angular. Тот, кто всегда возится с кодом, пытаясь сделать все быстрее, лучше и эффективнее. Я несколько раз занимался структурированием приложений Angular, и я здесь, чтобы поделиться с вами тем, что я узнал.
Теперь я не хочу хвастаться, но я видел свою долю плохо структурированных приложений Angular. Вы знаете те, о которых я говорю — они медленные, глючные и совершенно болезненные в работе. Но не бойтесь! С советами и рекомендациями, которыми я собираюсь поделиться, вы сможете структурировать свои приложения Angular как профессионал.
https://medium.com/@dimitarg.stoev/how-i-structure-my-angular-applications-d7d91a2da2e3
Как создавать диаграммы в Angular с динамическими данными, используя Chart.js
В этой статье я опишу, как отображать динамические данные в виде простых столбчатых, линейных, круговых и кольцевых диаграмм с использованием библиотеки Chart.js и Angular.
https://blog.bitsrc.io/how-to-create-charts-in-angular-with-dynamic-data-using-chart-js-45b9add7715e
В этой статье я опишу, как отображать динамические данные в виде простых столбчатых, линейных, круговых и кольцевых диаграмм с использованием библиотеки Chart.js и Angular.
https://blog.bitsrc.io/how-to-create-charts-in-angular-with-dynamic-data-using-chart-js-45b9add7715e
Medium
How to Create Charts in Angular With Dynamic Data Using Chart.js
Display dynamic data in simple bar, line, pie, and doughnut charts using the Chart.js library and Angular
Создание одностраничного приложения с помощью Vue и Kendo UI
SPA — хороший выбор при создании веб-сайта с минимальным набором функций или для обеспечения плавного и отзывчивого взаимодействия с пользователем. Посмотрите, как создать его в стиле Kendo UI для Vue. https://www.telerik.com/blogs/building-single-page-application-vue-kendo-ui
SPA — хороший выбор при создании веб-сайта с минимальным набором функций или для обеспечения плавного и отзывчивого взаимодействия с пользователем. Посмотрите, как создать его в стиле Kendo UI для Vue. https://www.telerik.com/blogs/building-single-page-application-vue-kendo-ui
Telerik Blogs
Building a Single-Page Application with Vue and Kendo UI
A SPA is a good choice for building a website with minimal features and a smooth and responsive UX. See how to build one styled with Kendo UI for Vue.
Три способа раскрыть API внутренних компонентов Vue
Мы все были там, у вас есть компонент с внутренним API (функцией или состоянием), который вы хотите предоставить родительскому компоненту, но с множеством вариантов для этого, какой из них лучше?
Недавно я ответил на вопрос об этом в Твиттере и подумал, что было бы неплохо написать об этом статью. Тем более что в Vue 3 у нас больше возможностей для решения этой проблемы, чем во Vue 2.
https://logaretm.com/blog/three-ways-to-expose-vue-component-api/?source=weeklyVueNews&campaign=ISSUE_ID_PLACEHOLDER
Мы все были там, у вас есть компонент с внутренним API (функцией или состоянием), который вы хотите предоставить родительскому компоненту, но с множеством вариантов для этого, какой из них лучше?
Недавно я ответил на вопрос об этом в Твиттере и подумал, что было бы неплохо написать об этом статью. Тем более что в Vue 3 у нас больше возможностей для решения этой проблемы, чем во Vue 2.
https://logaretm.com/blog/three-ways-to-expose-vue-component-api/?source=weeklyVueNews&campaign=ISSUE_ID_PLACEHOLDER
Logaretm
Three ways to expose internal Vue components API
And when to use each one of them
10 лучших (бесплатных) ресурсов Angular
Возможно, самый мощный JavaScript-фреймворк, Angular требует довольно много времени для обучения. Вот 10 ресурсов для преодоления этого, чтобы вы могли освоить этот зверь фреймворка! https://www.telerik.com/blogs/top-10-free-angular-resources
Возможно, самый мощный JavaScript-фреймворк, Angular требует довольно много времени для обучения. Вот 10 ресурсов для преодоления этого, чтобы вы могли освоить этот зверь фреймворка! https://www.telerik.com/blogs/top-10-free-angular-resources
Telerik Blogs
Top 10 (Free) Angular Resources
Perhaps the most powerful JavaScript framework, Angular does have quite a learning curve. Here are 10 resources for overcoming that so you can master it!
Зачем и как создавать шину событий в Vuejs 3
Прежде чем вдаваться в подробности этой конкретной реализации, позвольте мне описать принципы взаимодействия компонентов в Vuejs и почему мы решили использовать глобальную шину событий, даже если это не рекомендуется. https://devdojo.com/inspector/why-and-how-to-create-an-event-bus-in-vuejs-3
Прежде чем вдаваться в подробности этой конкретной реализации, позвольте мне описать принципы взаимодействия компонентов в Vuejs и почему мы решили использовать глобальную шину событий, даже если это не рекомендуется. https://devdojo.com/inspector/why-and-how-to-create-an-event-bus-in-vuejs-3
DevDojo
Why and how to create an Event Bus in Vuejs 3
Have you ever used an event bus in Vue 2 and don't know how to recreate it in Vue 3? Since I'm working on the 2.0 version of my product's UI (to be released in May) I'm publishing some technical trick...
Пользовательская директива всплывающей подсказки в Vuejs 3: Учебник
Пользовательские директивы в Vuejs 3 — это одна из тех вещей, где нет совместимости с предыдущей версией фреймворка.
Работая над новой версией панели управления интерфейсом Inspector, мне нужно было отображать всплывающие подсказки во многих разных точках приложения.
Прежде чем перейти к реализации директивы пользовательской всплывающей подсказки в Vuejs 3, позвольте мне представить основы хорошей стратегии повторного использования кода в Vuejs. https://devdojo.com/inspector/custom-tooltip-directive-in-vuejs-3-tutorial
Пользовательские директивы в Vuejs 3 — это одна из тех вещей, где нет совместимости с предыдущей версией фреймворка.
Работая над новой версией панели управления интерфейсом Inspector, мне нужно было отображать всплывающие подсказки во многих разных точках приложения.
Прежде чем перейти к реализации директивы пользовательской всплывающей подсказки в Vuejs 3, позвольте мне представить основы хорошей стратегии повторного использования кода в Vuejs. https://devdojo.com/inspector/custom-tooltip-directive-in-vuejs-3-tutorial
Расширение ссылок 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
Тег <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
Аутентификация и авторизация в Angular
https://www.c-sharpcorner.com/article/authentication-and-authorization-in-angular/
https://www.c-sharpcorner.com/article/authentication-and-authorization-in-angular/
C-Sharpcorner
Authentication And Authorization In Angular - Part Twelve
Before we get into the mechanics of implementing Authentication and Authorization, let’s have a quick look at high level architecture. So let’s start with Authentication. So in order to build authentication, on the client we need to build the login page and…
Макросы настройки скрипта Vue 3
Vue 3 Script Setup — рекомендуемый синтаксис, если вы используете как Single File Components, так и Composition API. Он обеспечивает чистую и лаконичную структуру, которая значительно сокращает шаблонный код.
Основная идея API композиции заключается в том, чтобы явно импортировать каждый помощник , который вам нужно использовать.
https://fadamakis.com/vue-3-script-setup-macros-ab754266363f
Vue 3 Script Setup — рекомендуемый синтаксис, если вы используете как Single File Components, так и Composition API. Он обеспечивает чистую и лаконичную структуру, которая значительно сокращает шаблонный код.
Основная идея API композиции заключается в том, чтобы явно импортировать каждый помощник , который вам нужно использовать.
https://fadamakis.com/vue-3-script-setup-macros-ab754266363f
Medium
Vue 3 Script Setup Macros
Vue 3 Script Setup is the recommended syntax if you are using both Single File Components and Composition API. It provides a clean and…
Как сделать 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.js. Как разработчики Vue.js, мы постоянно стремимся предоставлять высокочувствительные и эффективные пользовательские интерфейсы. Но что, если я скажу вам, что достижение ошеломляющего 3000-кратного увеличения скорости вашего приложения Vue.js вполне достижимо?
Приготовьтесь к захватывающему путешествию, пока мы погружаемся в мир оптимизации. В этой статье мы говорим не просто о дополнительных улучшениях или незначительных увеличениях скорости. Наша цель — не что иное, как монументальный скачок — повышение скорости в 3000 раз, которое бросит вызов вашим ожиданиям и раздвинет границы того, что вы считали возможным.
https://javascript.plainenglish.io/how-to-make-vue-js-3000-times-faster-826ee04a2491
Angular — шаблон адаптера: упрощение интеграции данных
Общим требованием современной веб-разработки является интеграция данных из нескольких источников. Однако работа с различными форматами данных и API может быть сложной, а код может быть тесно связан с конкретными источниками данных. Чтобы преодолеть эту проблему, шаблон адаптера предлагает решение, выступая в качестве моста между несовместимыми интерфейсами. В этой статье мы продемонстрируем шаблон адаптера на примере доски Канбан. Также будут предоставлены примеры кода и практические варианты использования, чтобы проиллюстрировать преимущества.
https://javascript.plainenglish.io/angular-adapter-pattern-simplify-data-integration-kanban-board-84f520313a3d
Общим требованием современной веб-разработки является интеграция данных из нескольких источников. Однако работа с различными форматами данных и API может быть сложной, а код может быть тесно связан с конкретными источниками данных. Чтобы преодолеть эту проблему, шаблон адаптера предлагает решение, выступая в качестве моста между несовместимыми интерфейсами. В этой статье мы продемонстрируем шаблон адаптера на примере доски Канбан. Также будут предоставлены примеры кода и практические варианты использования, чтобы проиллюстрировать преимущества.
https://javascript.plainenglish.io/angular-adapter-pattern-simplify-data-integration-kanban-board-84f520313a3d
Medium
Angular —Adapter Pattern: Simplify Data Integration(Kanban Board)
Simplifying Integration and Enhancing Flexibility
Наблюдение за температурой: введение в холодные и горячие Observable в rxjs
По мере изучения RxJS разработчик рано или поздно сталкивается с такими понятиями, как cold и hot observable. А на технических собеседованиях в команды, которые используют RxJS, можно услышать вопросы по этой теме.
Например, чем горячий поток отличается от холодного? Можно ли холодный поток превратить в горячий и наоборот? И если да, то как это сделать?
В статье попробуем разобраться в теме и найти ответы.
https://habr.com/ru/companies/tinkoff/articles/729808/
По мере изучения RxJS разработчик рано или поздно сталкивается с такими понятиями, как cold и hot observable. А на технических собеседованиях в команды, которые используют RxJS, можно услышать вопросы по этой теме.
Например, чем горячий поток отличается от холодного? Можно ли холодный поток превратить в горячий и наоборот? И если да, то как это сделать?
В статье попробуем разобраться в теме и найти ответы.
https://habr.com/ru/companies/tinkoff/articles/729808/
Хабр
Наблюдение за температурой: введение в холодные и горячие Observable в rxjs
По мере изучения RxJS разработчик рано или поздно сталкивается с такими понятиями, как cold и hot observable. А на технических собеседованиях в команды, которые используют RxJS, можно услышать вопросы...
Работа с формами в Angular — модуль работы с формами и обертки полей.
В статье покажу один из способов работы с формами в Angular-проектах, который упрощает создание новых форм и изолирует зависимость от внешней UI-библиотеки. Будет мало текста и много кода, пристегните ремни, мы начинаем.
Читать далее https://habr.com/ru/companies/tinkoff/articles/740706
В статье покажу один из способов работы с формами в Angular-проектах, который упрощает создание новых форм и изолирует зависимость от внешней UI-библиотеки. Будет мало текста и много кода, пристегните ремни, мы начинаем.
Читать далее https://habr.com/ru/companies/tinkoff/articles/740706
Хабр
Работа с формами в Angular — модуль работы с формами и обертки полей
Всем привет! Я Александр Бухтатый, frontend-разработчик в Тинькофф, специализируюсь на Angular. Наша команда работает в монорепозитории с четырьмя проектами. В каждом проекте много форм, нужно...
Основы Angular: встроенные Pipes с примерами каждого
https://www.telerik.com/blogs/angular-basics-built-pipes-examples-each
https://www.telerik.com/blogs/angular-basics-built-pipes-examples-each
Telerik Blogs
Angular Basics: Built-in Pipes with Examples of Each
Angular has some built-in pipes that allow us to render numbers and string values in a locale-specific format. Let’s take a look!
Forwarded from REact
Zedux: Это тот самый?
Zedux - это движок молекулярного состояния для React. После многих лет, проведенных в качестве проприетарного программного обеспечения, спрятанного в закрытом репозитории GitHub, он официально открыт и выпущена версия 1.0.0! https://omnistac.github.io/zedux/blog/zedux-is-this-the-one
Zedux - это движок молекулярного состояния для React. После многих лет, проведенных в качестве проприетарного программного обеспечения, спрятанного в закрытом репозитории GitHub, он официально открыт и выпущена версия 1.0.0! https://omnistac.github.io/zedux/blog/zedux-is-this-the-one