Angular Fanatic
1.34K subscribers
44 photos
2 videos
3 files
224 links
Ангуляр в каждый проект!
__________
Канал на паузе
Download Telegram
Ребята из valor-software, (которые делают ngx-bootstrap, ng2-dragula и еще много крутых штук), перевели, ngx-bootstrap на Angular Ivy,
что вас ожидает и с чем можете столкнутся можете узнать в статье:

https://valor-software.com/articles/ngx-bootstrap-angular-renderer.html
Manfred Steyer начал писать серию статей про построение архитектуры новых приложении с Ivy

https://www.softwarearchitekt.at/post/2019/07/17/architecture-with-angular-ivy-part-1-a-possible-future-without-ngmodules.aspx
ngFanatic еженедельник
31–07–2019

Релизы:
angular: 8.1.3, 8.2.0-rc.0, 9.0.0-next.0
angular-cli: v8.2.0, v8.3.0-next.0
angular material: 8.1.2 bologna-bayou

Статьи:
Конфигурация Angular приложения compile vs runtime (Juri Strumpflohner) простой пример реализации, а хороший вариант решения есть в этой статье.

Прототип приложения с Angular (Edwin Lee) статья про то как в Google быстро создали рабочий прототип на Angular для внутреннего CRM.

Typescript 3.6 Beta (Daniel Rosenwasser) Stricter Generators, More Accurate Array Spread, Improved UX Around Promises, DOM Updates

Переиспользование реактивных форм (Cory Rylan) выдержка из книги Angular Form Essentials про использование ControlValueAccessor

Предстоящие мероприятия:

6 августа 2019 г.
Angular Minsk №2

10 августа 2019 г.
Rostov Angular meetup
Алексей Охрименко
* Такие разные и в то же время одинаковые: Платформы в Angular
Сэм Булатов
* NestJS — бэкенд для фронтендаров
Андрей Греков
* Декларативный Angular
Владимир Гайдуков
* NativeScript + Angular = Love


22 августа 2019 г.
Special 🗽AngularNYC meetup in Moscow
Juan Herrera (Vienna),
Maxim «PWAdvocate» Salnikov (Oslo),
Kirill Cherkashin (NYC)

22 августа 2019 г.
Angular Belarus 🇧🇾 Meetup #1
В Ionic Studio наконец то добавили установку кастомных нативных плагинов и в целом улучшили возможность апргрейда приложения. Теперь инструмент действительно можно расматривать для использования в разработке, а не как очередной инструмент для прототипирования и перетаскивания компонентов.
ngFanatic еженедельник
07–08–2019

Релизы:
angular: 8.2.0
angular-cli: 8.2.0, v8.3.0-next.0
angular material: 8.1.2 bologna-bayou

Статьи:
Understanding Content Projection in Angular (Carlos Caballero) статья для тех, кто все еще не разобрался с ng-content, ng-template, ngTemplateOutlet и в целом со структурными директивами.

Angular and Cypress UI Testing with Applitools (Bilal Haidar) Applitools - это инструмент для автоматического тестирования скриншотами. В статье подробно расписано как делать e2e тесты с помощью cypress и Applitools SDK

Angular and the REST, Nest.js and JWT (Bilal Haidar) Самый простой способ добавления авторизации в Nestjs с последующей интеграцией в Angular приложение.

Marble testing with RxJS testing utils (Kevin Kreuzer) Если вы хорошо изучили https://rxmarbles.com , то вам обязательно понравится тестировать ваш RxJS код с помощью простого синтаксиса. - x-x-x - -x-x-x-| и т.д.

Create your own image classifier with Angular and Tensorflow.js (Eliran Eliassy) Простое подключение в Angular приложение tensorflow.js и использование модели mobilenet для классификации изображения.
Хочу порекемендовать 2 авторских канала (если вы почему то еще на них не подписаны):

@juliarderity ведут канал Серёжа Рубанов и Роман Дворнов, пишут про спецификации, пропозалы, TC39, WebAssembly.

@obenjiro_notes новый канал Алексея Охрименко, обещает расказывать про Frontend, Backend, Fullstack, QA, DevOps, Administration, BigData, Machine Learning, Agile и о том что накипело
ngFanatic еженедельник

21-08-2019

Релизы:

angular:
8.2.2, 9.0.0-next.2 (2019–08–12)
angular-cli: 8.2.2, v8.3.0-rc.0
angular material: 8.1.3

Статьи:

Architecture with Angular Ivy — Part 2: Higher order and dynamic Components
Manfred Steyer — Долгожданная динамика в Ivy, пока без публичного API, но команда Angular обещает сделать их публичными. Так же бонусом в конце статьи, для тех кто себе может позволить(наплевать на производительность и размер бандла), продемонстрирован способ компиляции компонентов (в Ivy) в рантайме.

Introducing Transloco: Angular Internationalization Done Right
Netanel Basal.
Вот не успел Oliver Combe (тот кто пилил i18n core и ngx-translate) уйти в свободное плавание после гугла, так Basal запилил свой вариант для переводов, и обещает его сделать лучше чем ngx-translate. И даже написал мигратор ngx-translate to transloco (правда обычным regexp, не то что мой, через суровый ngAST =)). Мое мнение: можно юзать, но через год все равно придете к i18n core.

The Ultimate Guide to Implementing Feature Flags in Angular Applications
Netanel Basal.
Feature Flags — довольно известная техника при разработке, когда зачастую функционал скрывают за ними. В статье Basal приводит варианты для использования этой техники, во всех Angular сущностях.

The Best Way To Lazy Load Angular Elements
Tomas Trajan.
Ну что ж, конвертируем в WebComponents, и юзаем как угодно и где угодно. Казалось бы везде об этом уже написано, а что если нам потребуется загрузить веб компонент в наш Angular компонент? как раз в статье Tomas приводит интересное решение:
простую директиву:
<some-element *axLazyElement=”https://my.elements/some-element.js”></some-element>

Sharing Components Between Angular Applications
Jonathan Saring.
А вы знали о таком решении, как bit для создания, версионирования и шаринга ваших ui компонентов между продуктами ? Решение имеет cli для популярных фреймворков, в статье разобрано, как это использовать с Angular.

Tracking errors in Angular with Sentry
Nils Mehlhorn.
Ну просто подключите Sentry к вашему продукту, и появится весь stacktrace говорится в статье.

Implementing undo-redo with NgRx or Redux
Nils Mehlhorn.
Пример реализации паттернов memento и command для создания undo и redo функционала для вашего приложения. Стоит почитать, если не делали этого никогда, хотя в статье и не разобраны коллизии при работе с несколькими источниками данных

Managing Key-Value Constants in TypeScript
lacolaco / Suguru Inatomi.
Мы часто работаем со множествами, и хорошо если они у нас типизированы. В статье показано как начиная с typescript v3.4, а это означает еще и то что с Angular 8, можем превращать массив в tuple, простым движением, [array] as const потом же с него в тип type MyType = typeof myTuple[number]; а в конце просто key-value Record<MyType,string>

What Is a Higher-Order Observable?
Deborah Kurata. И на последок про RxJS, HOO
А вот и Oliver Combe обьявился со своим новым "профессиональным" решением для i18n, порой кажется что теперь у каждого разработчика своя open source либа для i18n.
И вроде будет сразу для ivy.
Для раннего доступа можете подписаться и отправить данные в форму: https://www.locl.app/

Судя по вопросу "Какой функционал вы хотели бы получить за 50$" Либа будет условно платной.
Немножко запоздалый еженедельник, но все же =)

#ngFanatic #еженедельник

04–09–2019

Релизы:

angular:
8.2.4, 9.0.0-next.4 (2019–08–28)
angular-cli: 8.3.2, v9.0.0-next.2
angular material2: 8.1.4

Статьи:

Build Minesweeper in Under an Hour with Angular
(Stephen Fluin) Stephen запилил игру “минер” на Angular и снял по нему видео. А вот тут сама игра и исходники. На самом деле там обычный ngFor, click и стандартный алгоритмы.

Good Things Come to Those Who Wait: What’s new in Transloco
(Netanel Basal) Немного улучшили core и сделали плагин под MessageFormat (для ICU expressions если кто не знал). Еще пару плагинов для поддержки мульти стораджа. Обещают сделать CLI для всего.

All you need to know about Angular animations
(Mustapha Aouas) Если вы еще не работали с анимациями в Angular, этой статьи должно хватить чтобы все узнать.

Angular Tools for High Performance
(Minko Gechev) Так как Minko отвечает за тулзы вокруг Angular, он сделал небольшой обзор по ним. Тут про ngx-loadable, @herodevs/hero-loader, ngx-quicklink, angular CLI со встроенным budget, @angular/fire, @azure/ng-deploy , @zeit/ng-deploy @netlify-builder/deploy angular-cli-ghpages. В целом список очень небольшой, только я могу вспомнить 10+ тулзов который использую при работе.

What’s coming to Angular version 9
(Minko Gechev) Тут слайды Minko, про Angular 9 прямиком из ngBolivia. Как всегда обещают “Быстрее, выше, сильнее”. И попытка подсадить всех на Bazel.

Automatic deployment with the CLI (angular.io) Eсли вы давно не заглядывали в доки Angular, то самое время это сделать, тут про быстрый deploy добавили.
Несколько часов назад начался AngularConnect,
Сегодня в программе Angular in Google, Nrwl, Ivy, WebXR, Nest и много интересных докладов:
https://www.youtube.com/watch?v=lXbjICP6V44
Сегодня, 25 сентября в 20.30 мск проидет очередной ngRuAir
Тема: uiBakery: инструмент для прототипирования Angular приложений вместе со специальным гостем: Никитой Полторацким
https://www.youtube.com/watch?v=0zJck44Bc0E
Еженедельник запоздал,

поэтому немножко последних статей про NestJs:

Announcing NestJS Monorepos and new CLI commands

Build your first serverless app with Angular, NestJS and Azure

Deploying NestJS Apps to Zeit Now

Deploy NestJS Serverless Apps to Azure Functions

Если вы заметили, то все статьи на trilon.io , это такой аналог nrwl, только уже вместе с Kamil Mysliwiec (NestJS) и Mark Pieszak (Angular Universal team)
Давайте поучаствуем в Hacktoberfest 2019,
Сюда можете занести ваш любимый Angular ресурс (статью, видеоролик, либу и т.д.)

Здесь будут собраны лучшие материалы за этот год.

https://timdeschryver.github.io/hacktoberfest-2019-angular/
Через 30 минут начинается ngAir.
Тема выпуска: Использование Angular Elements в React компонентах

https://youtu.be/cdrMozMs0PY
#ngFanatic #еженедельник от 16.10.2019

Релизы:

angular:
8.2.10, 9.0.0-next.10 (2019–10–09)
angular-cli: 8.3.9, v9.0.0-next.9
angular material2: 8.2.3

Статьи:

How to test Observables (Kevin Kreuzer) — Полное руководство по тестированию Observables, чтобы вы больше не путались.

Creating Behavioral Components in Angular (Netanel Basal) — Из этой статьи можно извлечь:
- Как мы можем подписаться на события в дочерних компонентах, и изменять их поведение на верхнем уровне;
- Как с помощью exportAs можно вытащить состояние компонента и использовать его внутри ng-content;
- Как организовать Lazy компоненты и не рендерить их по его собственному состоянию.

Discover Iterative DOM, the magic behind Angular Ivy (Francesco Leardini) — Основной посыл статьи: Iterative Dom tree-shakable поэтому ваши бандлы должны стать еще меньше.

Clarity’s future: user-focused, framework-independent, accessible, enterprise-ready, and open source (Jehad Affoneh) Если вам лень писать свою либу компонентов, или хотите узнать а как надо писать, то вам обязательно необходимо взглянуть на Clarity.

10 Things Every Angular Developer Should Know About Zone.js (Matthias Junker) очень крутое руководство по Zone.js c различными отсылками к офф документации. Про управления событиями, какие можем закинуть в blacklist, или какие события оборачиваются Node.

Celebrating Another Year of TypeScript (Ben Coveney) Typescript уже 7 лет, а вот AtScript могло бы быть 5 ;) хорошо что сумели обьедениться.

Creating Modals in Angular (Chidume Nnamdi) простая модалка на ангуляре.

Либы:

Ng-sortgrid (Kevin Kreuzer) Очень легкая либа для draggable grid.

🎁 Бонус

И просто напомню, вы можете поучаствовать в Octoberfest улучшив ngx-bootstrap, и получить дополнительные подарки.
Сегодня прошел WSD в Екатеринбурге, где Андрей Старовойт из webstorm рассказал про поддержку фреймворков, на примере Angular, где вы можете узнать почему так долго индексируется ваш Angular проект.

https://youtu.be/DsfnFrwKksA?t=5278

ну если и этого мало, то можете поковырять плагин Angular под webstorm:
https://github.com/JetBrains/intellij-plugins/blob/master/AngularJS/src/org/angular2
#ngFanatic еженедельник от 27.10.2019

Релизы:

angular:
8.2.12, 9.0.0-next.14
angular-cli: 8.3.14, v9.0.0-next.15
angular material2: 8.2.3


Статьи:

Testing Asynchronous Code in Angular Using FakeAsync (Netanel Basal)
Статья про то как использовать FakeAsync, и сделать тесты более предсказуемыми. Ну и конечно это все под соусом из Spectator.

Overriding Angular Schematics (Santosh Yadav)
Статейка про переопределение стандартных schematics в angular.json. Default onPush и все такое.

Adding Font Awesome to an Angular CLI project using npm (Rocky Segarra)
про [FontAwesomeModule] и <fa-icon [icon]="faTwitter"></fa-icon> и как с помощью этого пакета грузить только те иконки, которые действительно нужны.

TypeScript Types: The Any Type (Todd Motto)
noImplicitAny, noImplicitThis, strictNullChecks, alwaysStrict - true всем!

Vanilla JavaScript and HTML - No frameworks. No libraries. No problem. (John Papa) На счет No problem конечно сомнительно, но стоит задуматься.

Компоненты-агностики в Angular (Александр Инкин)
Динамика на минималках.
Завтра, 30 октября в 20.30 мск проидет очередной ngRuAir. В этом выпуске с нами будет Andrey Starovoyt из JetBrains и расскажет как они поддерживают фреймворки в WebStorm и почему отказались от Angular language service
https://www.youtube.com/watch?v=jLvtwNmbPKU