🦊 Angular Fox 🚀 — русскогорящие новости сообщества

🔥 Создаем клон TikTok с помощью Angular Как насчет того, чтобы сделать клон TikTok? Вы можете подумать, что это слишком сложно, но Виталий Шевчук обещает, что мы построим его самым эффективным и ленивым способом, с минимальным количеством кода, и узнаем много нового о современном фронтенде. Больше никаких скучных учебников, только красивые, реальные примеры, изучайте Micro Frontend, создавая TikTok. 👉 https://javascript.plainenglish.io/building-beautiful-tiktok-clone-with-angular-and-micro-frontend-part-1-bdd189425695

✨ Проектирование архитектуры Angular Проектирование архитектуры может быть непростым делом, особенно в мире agile, где требования часто меняются. Поэтому ваш проект должен обеспечивать расширяемость без необходимости серьезной модификации. Maciej Wojcik призывает не писать ненужный код — вы не можете предсказать будущие изменения, а спланировать и реализовать архитектуру, которая упростит расширение, независимо от того, как будут меняться требования. 👉 https://indepth.dev/posts/1478/designing-angular-architecture-container-presentation-pattern

🚀 Портфолио на Jamstack Angular приложения могут стать быстрее, если сделать их статичными при помощи Scully. Scully — это генератор статических сайтов, который создает HTML-страницу для каждого маршрута в вашем приложении. Эти страницы быстрее доставляются и эффективны для SEO. В этом уроке вы создадите портфолио и блог с помощью Angular 11 и Scully. 👉 https://www.digitalocean.com/community/tutorials/how-to-build-a-jamstack-portfolio-with-angular-11-and-scully

✨ Опыт создания мобильных приложений на Ionic/Angular Ionic — это набор инструментов пользовательского интерфейса для создания мобильных и настольных приложений с использованием HTML, CSS и JavaScript, а также с интеграцией с популярными фреймворками, как Angular. Константин Берлинский рассказал как погрузился в мобильную разработку, с какими трудностями столкнулся и как решал возникшие проблемы. 👉 https://habr.com/ru/post/599133/

✨ WebSockets в Angular WebSocket API — позволяет осуществлять связь между клиентом и сервером, как для отправки сообщений, так и для получения ответов без необходимости делать новый запрос к серверу. В этом туториале рассказывается, как реализовать сервис для взаимодействия через WebSocket API. 👉 https://indepth.dev/tutorials/angular/how-to-implement-websockets-in-angular-project

✨ Angular Pipes: Полное руководство Pipes — это простой способ форматирования данных для рендеринга. Когда вы их используете, вам не нужно менять данные, чтобы они соответствовали представлению. В этой руководстве рассматриваются важные концепции, необходимые для понимания Angular Pipes. 👉 https://indepth.dev/tutorials/angular/angular-pipes-complete-guide

✨ Меню с использованием динамических данных В этом туториале мы узнаем, как создавать вложенные меню на основе динамических данных. Сначала изучим основы Angular Material Menu и узнаем, как отобразить вложенное меню с помощью статичного HTML-шаблона. Затем поймем, какие изменения необходимы для динамического рендеринга вложенных меню на основе данных. 👉 https://indepth.dev/tutorials/angular/angular-material-nested-menu-dynamic-data

✨ Порядок операторов в RxJS Операторы — это важные элементы RxJS, которые позволяют легко писать сложный код в декларативном стиле. Они атомарны и очень просты, но могут объединяться в сложные последовательности, в которых легко допустить ошибку. Вербило Александр разобрал варианты последовательностей в RxJS, показал типичные ошибки в них и как валидировать их порядок. 👉 https://habr.com/ru/post/598151/

✨ Как использовать ngx-formly в Angular Как часто вы создаете формы? Приходила ли вам идея улучшить этот процесс? Ngx-formly — это библиотека динамических форм для Angular, которая поможет вам легко реализовать формы и добавлять к ним специфическую валидацию. В этой статье вы узнаете, как использовать, настраивать и кастомизировать ngx-formly. 👉 https://indepth.dev/tutorials/angular/how-to-use-ngx-formly-with-angular

⚠️ Осторожно мошенники⚠️ Тут кто-то взял имя @kirjc поставил мою аватарку и имя и просит деньги в долг. Это не я, не давайте и шлите в спам upd: Говорят что от имени Лиса тоже присылают Пока предположительно человек брал контакты из @kirjs_ru_chat, если вам написали а вы не оттуда, пожалуйста отпишитесь тут. (Добавил еще скрин в комменте)

Кто-то от моего имени и имени Кира клянчит битки — не ведитесь 👇

✨ Скрытие информации в Angular Главная особенность SPA — это то, что весь код приложения грузится на клиент, это делает приложение отзывчивее, но при этом полностью открытым. SPA может раскрыть: конфигурацию системы, API запросы, явно прописанные данные (ключи, логины, пароли) и т.д. В статье, на примере Angular приложения, показывается как получить полезные данные и описаны способы защиты. 👉 https://habr.com/ru/company/nspk/blog/597097/

✨ Angular Material Theming System: Полное руководство В последних выпусках Angular Material был переработан API SASS для создания тем. В этом руководстве мы создадим проект с Angular Material, добавим в него пользовательскую тему, разберем некоторые важные миксины, разберемся с типографикой, реализуем ленивую загрузку темы, чтобы она загружалась только тогда, когда это необходимо. 👉 https://indepth.dev/tutorials/angular/angular-material-theming-system-complete-guide

✨ Краткое руководство по Angular и GraphQL За последние 5 лет GraphQL зарекомендовал себя как наиболее популярная альтернатива REST API. Он обеспечивает гибкий способ реализации API, который можно расширять, не ломая существующих клиентов. В этом руководстве Holger Schmitz, на примере приложения по «Звездным войнам», показал как использовать GraphQL в Angular. 👉 https://developer.okta.com/blog/2021/10/22/angular-graphql

🦄 Новогодняя история телеграм-бота Ребята из Tinkoff написали небольшую игру по мотивам фильма «Один дома» на NestJS и поделились опытом её создания. Игроки будут две недели помогать Кевину программировать устройства в умном доме, чтобы разрушить планы грабителей. Если вам нравится решать головоломки, то вы точно сможете помочь Кевину! 👉 https://habr.com/ru/company/tinkoff/blog/596287/

✨ 5 удивительных возможностей Angular Angular отлично подходит для разработки корпоративного программного обеспечения с большой кодовой базой. А каждая большая кодовая база со временем ухудшается, обычно из-за того, что некоторые практики программирования со временем оказываются неприемлемыми. Radek Busa представил пять простых и аккуратных приемов для рефакторинга вашей кодовой базы. 👉 https://levelup.gitconnected.com/5-angular-features-you-might-not-have-known-about-d809babb51a4

✨ Советы по NgRx NgRx предоставляет возможность реализовать одну и ту же функциональность множеством разных способов. Некоторые из этих способов со временем превратились в лучшие практики, которые позволяют повысить качество кода, производительность и удобство сопровождения. Marko Stanimirović собрал список советов и лучших практик по использованию библиотек @ngrx/store и @ngrx/effects. 👉 https://dev.to/this-is-angular/ngrx-tips-i-needed-in-the-beginning-4hno

✨ Реактивные формы Давайте рассмотрим различные способы создания реактивных форм в Angular, сосредоточившись на цепочках зависимостей. Если FormControl управляет другим FormControl, который, в свою очередь, управляет третьим FormControl, все быстро становится беспорядочным. Stephan Rauh показал, как можно работать с формами неправильно и как делать это лучше. 👉 https://www.beyondjava.net/reactive-forms-validation-formulas

✨ Динамическая загрузка компонентов В Angular вы можете показывать различные компоненты или даже части шаблонов условно, используя встроенные директивы, такие как *ngIf. Использование *ngIf работает, когда количество условных изменений шаблона невелико, но что если представление имеет много изменений? После прохождения этого туториала у вас будет приложение на Angular, которое отображает уникальный контент для аутентифицированного пользователя. 👉 https://developer.okta.com/blog/2021/12/08/angular-dynamic-components

✨ Объяснение перегрузки функций в TypeScript Некоторые функции могут принимать переменное количество аргументов, аргументы разных типов и даже возвращать разные типы в зависимости от того, как вы вызываете функцию. В TypeScript есть механизм перегрузки функций, который позволяет определять функции, которые можно вызывать несколькими способами. Давайте посмотрим, как это работает. 👉 https://dmitripavlutin.com/typescript-function-overloading/