Angular Vue js React
1.83K subscribers
238 photos
2 videos
2 files
758 links
Полезные материалы по JS фреймворкам
По всем вопросам: @un_ixtime
Download Telegram
Кураторский список замечательных вещей, связанных с Vue.js
_______________________________

Потрясающий Vue.js

https://shly.link/dev4oCo
Пользовательский шаблон Vue 3 — Vite, Pinia, Vue Router и Tailwind CSS
____________________________

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

https://shly.link/mdmJL2u
Бесконечная прокрутка в Angular
________________________

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

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

https://shly.link/ZY2ep
Angular: перезагрузка/обновление компонента или всего приложения и повторное использование логики в нескольких компонентах
________________________________

Существует большая разница между перезагрузкой одного компонента и перезагрузкой всего приложения. Мы увидим, как оба могут быть достигнуты.

https://shly.link/dfU0A
Идеальный шаблон чистой архитектуры для проектов TypeScript
____________________________

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

https://shly.link/0QDTW
Angular Управление состоянием URL-адресов с помощью параметров запроса или параметров маршрута
______________________________

В этом сообщении блога объясняется процесс сохранения состояния с использованием URL-адреса браузера. В Angular есть несколько разных способов управления состоянием.

—Угловые сервисы
—Библиотека управления состоянием, такая как NgRx, Akita, Elf и т. д.

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

https://shly.link/dev1ovM
Как создавать собственные каналы в Angular, что такое чистые и нечистые каналы и как использовать чистые каналы для повышения производительности приложения.

https://shly.link/9pHWV
VueUse — библиотека, которая делает Vue 3 достойным обновления
__________________________________

VueUse — это набор из более чем 200 основных служебных функций для взаимодействия с различными API, такими как браузер, состояние, сеть, анимация, время и многое другое.

https://shly.link/mdmhXQe
15 революционных инструментов в экосистеме Vue 3
_____________________________

Экосистема Vue.js развивалась за последние несколько лет, особенно с учетом того, что Vue 3 стала версией по умолчанию с понедельника, 7 февраля 2022 года . Этот пост будет посвящен главным образом инструментам, которые вращаются вокруг экосистемы Vue 3.

https://shly.link/uMgtw
Стандарты и лучшие практики Angular
______________________________

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

https://shly.link/mdmy9PL
Как я нашел идеальный стек для освоения HTML и CSS — Vue без сборки
______________________________

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

https://shly.link/devM8xd
Использование Angular NgOptimizedImage для реализации лучших практик загрузки изображений
______________________________

Директива NgOptimizedImageв Angular отвечает за реализацию лучших практик производительности при загрузке изображений. Она доступна в Angular v14.2.0. Директива помечена как автономная и может быть импортирована в автономные компоненты и модули.

https://shly.link/CLoWH
"Javascript developer. Professional" - это хардкорный онлайн-курс для web-разработчиков по продвинутым возможностям JS и его фреймворков.

Справитесь ли вы с уровнем курса? Покажет вступительный тест.

📍Пройдите тестирование, чтобы:
● оценить свои навыки
● получить доступ к демо-занятиям курса
● занять место по специальной цене
● получить доступ в закрытое сообщество JS-разработчиков

👉 Пройти полное тестирование: https://otus.pw/kPF2/
Многоразовая каскадная анимация с Angular Animation

__________

Вы когда-нибудь думали о том, как сделать пользовательский опыт лучше, когда у нас есть список карточек!?

Сегодня я покажу, как мы можем сделать это с помощью «каскадной» анимации карты и получить красивую страницу карты, используя возможности Angular Animations !

Итак, сначала давайте немного поговорим об Angular Animations!

https://shly.link/devbGdt
Типы директив в Angular
_________________

В этой статье мы узнаем о типах директив в angular.

https://shly.link/gD1J0
Полное руководство по Vue 3 Composition API
_________________

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

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

https://shly.link/vr7t6
Как строить диаграммы в Angular с помощью Chart.js
______________

Чтобы использовать charts.js в Angular, в большинстве руководств предлагается использовать библиотеку вместе с библиотекой ng2-charts, которая поставляется со стандартной директивой базовых диаграмм, помогающей создавать различные диаграммы. Проблема такого подхода в том, что оба пакета иногда строятся по-разному и не обновляются одновременно. Поэтому каждая версия chart.js имеет определенную версию ng2-chart, с которой она может работать.

Реализовать функции в Angular легко с помощью пакетов, но иногда работа с пакетами, которые зависят друг от друга в Angular, может быть очень сложной из-за различий в версиях пакетов. У меня возникли трудности, когда я попытался построить диаграммы в приложении Angular с помощью пакета chart.js и ng2-charts. В конце концов мне пришлось реализовать диаграммы без использования пакета ng2. В результате эта статья покажет вам простой способ построения диаграмм в Angular с помощью chart.js без установки пакета ng2-chart.

https://shly.link/o6WsU
Использование React в приложениях Angular
___________

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

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

https://shly.link/zDWYj
Что нужно освоить Fullstack-разработчику JavaScript? Начните изучать необходимые технологии на открытых уроках практического онлайн-курса «JavaScript Developer. Professional» от OTUS.

1 сентября в 20:00 — «Обзор технологий для построения API».
Рассмотрим несколько протоколов клиент-серверных приложений и на примере посмотрим на их сильные и слабые стороны.
Регистрация - https://otus.pw/zL3v/

15 сентября в 20:00 —
«Кодогенерация Typescript».
Научимся писать программы, которые пишут код на Typescript за нас, а также попробуем в действии несколько библиотек и приобретем навык чтения абстрактного синтаксического дерева.
Регистрация - https://otus.pw/H5JG/

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

‼️ Для участия нужно пройти вступительный тест и зарегистрироваться: https://otus.pw/FG2U/
Как создать ввод OTP в Vue 3
________________

Ввод OTP — один из самых забавных компонентов, которые вы можете использовать в своем приложении. Они делают сухой процесс заполнения еще одной формы немного более увлекательным.

https://shly.link/V6AnU
Что такое PortalVue и как мы можем использовать его в качестве слота
____________

PortalVue может быть действительно полезной функцией и может сделать ваш проект более динамичным.

https://shly.link/LsTRp