Angular Fanatic
1.34K subscribers
44 photos
2 videos
3 files
224 links
Ангуляр в каждый проект!
__________
Канал на паузе
Download Telegram
Скоро скоро выйдет Angular 8.
И вот мои заметки про angular/cli:
- cli по дефолту будет генерировать 2 бандла, под es2015 и es5.
- настройки в browserslist
- в browserslist все еще настройка под googlebot на Chrome 41, хотя уже юзается 74.
- Бандл с enable-ivy, в gzip 40кб
- добавлен web worker в schematics
- отдельный tsconfig для ваших web worker модулей.
и еще много интересных штук ;)
подробнее
Хотел бы порекомендовать для вас крошечный стеит менеджер для React и Preact — Storeon. Всего 173 байта. На данный момент имеется 2 дополнительных расширения:

- @storeon/localstorage позволяет сохранять стеит в localStorage.
- @storeon/crosstab позволяет синхронизировать стеит между вкладками браузера.
Подробнее можете почитать тут: https://evilmartians.com/chronicles/storeon-redux-in-173-bytes

Причем тут Angular?

Для меня вес конечного бандла имеет значение. Тогда как существующие стеит менеджеры со всем своим обвесом могут достигать в размере более 100кб, Storeon (со своими 173 байтами) кажется очень привлекательным. И все таки 100кб js кода это не 100кб jpeg. К тому же чем меньше сама библиотека требует, тем меньше нужно писать боилерплейта .

Поэтому сделал свою обертку над Storeon — ng-storeon в 526 байтов (что конечно же еще не предел). ng-storeon имеет примерно такой же api как в react / preact версии, только на выходе более привычный Angular разработчикам Observable.

К тому же скоро выпустят предварительную версию Angular Ivy, где пофиксили размер конечного бандла, не 3кб конечно(как показывали 2 года назад), но к этому будет стремиться команда Angular.

Так же собрал ng-storeon вместе Angular Ivy в @angular/[email protected] rc3.

p.s. Пока это писал либа уже успела переехать в
@storeon/angular.
Буквально через пару минут начнется Angular Air.
Где Stephen Fluin раскажет о текущем состоянии Angular, предстоящей 8 версии. И о том, что ожидается в будущем.

https://www.youtube.com/watch?v=y6pIcDgHd0I
ng analytics off

Почему то нигде не увидел анонса этой фичи..

Начиная с 8 версии, будет встроена функция сбора аналитики использования Angular CLI.
При создании проекта будет спрашивать разрешение на включение (или выключение) этой опции.

Так же можно будет вставить свой ключ и шарить в аккаунт Google Analytics.
Я тут недавно решил пройтись по собеседованиям на позицию фронтенд разработчика, и на одном из них мне задали тестовое задание. Задание довольно интересное, и решил я ее конечно же на Angular. Хочу поделиться с вами этим решением, и объявляю challenge по решению различных фронтовых задач.
По форме ниже вы можете прислать мне задачу, и я постараюсь публиковать решения по интересным задачам. (Все будет реализовано на Angular)

P.s. пожалуйста не нарушайте nda и прочее при публикации

https://docs.google.com/forms/d/e/1FAIpQLSdsRZ8k__peiAoyfzUBnhEY7EsGzQMWxm0xGIyq9Ic7EXfQwQ/viewform
Давайте соберем отзывы по использованию NestJS, и напишем свои пожелания, что хотелось бы увидеть, что не устраивает ;)
Спасибо)
(p.s можно на русском)

https://docs.google.com/forms/d/e/1FAIpQLSeu9-EWYL3FlYizZz3GPNc5Zo2gn7YXyNk1EtfLlwKU4nO-5w/viewform
Ждете пока stackblitz включат поддержку Angular Ivy?
Не надо ждать, Alexey Zuev сделал эту поддержку в ng-run:
https://ivy.ng-run.com
Так же можете посмотреть todo list в нем же:
https://ivy.ng-run.com/edit/GWEOnhuhLkPfbHVdBRib?open=app%2Fapp.component.ts
Ivy с нами, пора пилить свои декораторы;)
Elias Sander представил свою версию декораторов life cycle.

@se-ng/ivy-life-cycle-decorators

Кстати, Elias Sander со времён AngularJs отвечает на различные вопросы в Angular форуме. И недавно получил GDE.

https://www.npmjs.com/package/@se-ng/ivy-life-cycle-decorators
Крутой UI от VMware,
Clarity UI обновилась до 2.
https://clarity.design/news/2.0.0

У ребят очень много идеи, и на это уже нарисованы дизайны. Надеюсь, после усиления команды, они все таки их реализуют.
Ангуляр в каждый проект!
Если вы еще не видели консольное приложение на Angular, то обязательно взгляните на этот проект от NikPoltoratsky:

https://github.com/Tibing/platform-terminal
а вот тут слайды с конфы.
Когда то давно, (https://t.iss.one/ngFanatic/3) писал что буду публиковать тут еще немного про deno.
Я думаю время настало.

1. В deno теперь зависимости идут таким образом:
core - все что внутри deno
std - набор стандартных пакетов,
x - все остальное, если вы напишите крутой и нужный пакет, то вскоре он попадет в std.
2. Есть вот такой вот условный compat-table
https://deno.dev/wpt/ , но это Web-Platform-Tests for Deno.
3. Думаю пора добавить в compat-table Deno, так как Deno совсем не Nodejs, и там нет его болячек.
4. Есть вот такой online playground: https://deno-play.app/
5. В ближайших релизах хотят плотно поработать над WebAssembly.
6. X пакетов сейчас 55+
7. Общение в основном в gitter, а в телеге тут: https://t.iss.one/denoland
8. Установщик теперь стал более стабильным.
9. Проект все еще эксперементальный, и это не убица Nodejs.
10. Остальное можете узнать с выступлений Раяна.

А еще сделал веб фреймворк для deno, c кучей примеров для ваших экспериментов =)
Alosaur 🦖
https://github.com/irustm/alosaur
Как то мне приходилось убеждать своих руководителей перейти на Angular.
И вот с тех пор собираю мнения разных людей в пользу Angular.
Опубликовал это в один gist.
Если есть что дополнить, приглашаю в комменты ;)

https://gist.github.com/irustm/375a9db35be6273368ac16be9e844cfa
This media is not supported in your browser
VIEW IN TELEGRAM
В прошлом году анонсировали публичный API для Figma, и показали демку генерации компонентов в React.
Круто, подумал я, и переделал это под Angular.
В итоге генерируются глупые компоненты, и один модуль.
Важно! Чтобы все получилось, в Figma переменные в тексте нужно обозначить $ в начале, а компоненты - #.
Ну и чтобы появилась реактивность подключаем FigmaModule, вставляем нужный компонент, и прокидываем значения внутрь. 🥳

https://github.com/figma/figma-api-demo/pull/16
Ребята из 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 наконец то добавили установку кастомных нативных плагинов и в целом улучшили возможность апргрейда приложения. Теперь инструмент действительно можно расматривать для использования в разработке, а не как очередной инструмент для прототипирования и перетаскивания компонентов.