Angular

  • ХабрахабрФото Как работает ViewEncapsulation и ng-deep в Angular

    Как работает ViewEncapsulation и ng-deep в Angular

    Перевод (а точнее оригинал) моей статьи опубликованной здесь Многие Angular разработчики и верстальщики, пишущие CSS/SCSS код в Angular-приложениях сталкивались с ситуацией, когда надо применить стили к компоненту вложенному в текущий и не до конца разобравшись как это работает, выключали инкапсуляцию стилей или добавляли ng-deep, при этом не учитывая некоторых нюансов, что в последствии приводит к проблемам. В данной статье я…

    Читать далее »
  • ХабрахабрФото Функция Reactive во Vue: как это работает

    Функция Reactive во Vue: как это работает

    После jQuery я попробовал AngularJS и был очарован его возможностями. Несколько строк в AngularJS заменяли кучу спегетти-кода в jQuery. Это было похоже на магию. Сейчас все современные Frontend-фреймворки так или иначе обеспечивают реактивность, и это уже никого не удивляет. Тем не менее далеко не все разработчики понимают, как это работает. Сейчас я работаю с Vue, поэтому и разбираться с тем,…

    Читать далее »
  • ХабрахабрФото Фронтенд-новости №3. Node.js v18.0.0, аннотации типов в JavaScript, СSS Toggles

    Фронтенд-новости №3. Node.js v18.0.0, аннотации типов в JavaScript, СSS Toggles

    Дайджест новостей из мира фронтенд-разработки за последнюю неделю 18–24 апреля. Спецификации HTML CSS JavaScript React Angular  Node.js Оптимизации Общее Как читать статьи на английском языке В дайджесте много статей и видео на английском языке, чтобы это не стало препятствием: в Google Chrome есть функция перевода страницы с любого популярного языка, а видео можно перевести в Яндекс Браузере.

    Читать далее »
  • ХабрахабрФото [Перевод] CSS :has() селектор

    [Перевод] CSS :has() селектор

    Эта статья — перевод оригинальной статьи Ahmad Shadeed "CSS Parent Selector" Также я веду телеграм канал “Frontend по-флотски”, где рассказываю про интересные вещи из мира разработки интерфейсов. Вступление Вы когда-нибудь задумывались о селекторе CSS, где вы проверяете, существует ли конкретный элемент внутри родителя? Например, если у компонента карточки есть миниатюра, нам нужно добавить к нему display: flex. Это было невозможно…

    Читать далее »
  • ХабрахабрФото Зачем использовать materialize и dematerialize операторы, и что такое Notification в RxJS?

    Зачем использовать materialize и dematerialize операторы, и что такое Notification в RxJS?

    Вы когда-нибудь встречали такие операторы, как materialize и dematerialize в RxJS? А что насчет класса Notification? Вероятно, многие слышали, но не до конца представляли, где их можно применить на практике. В этой статье я расскажу, что делают эти операторы и приведу несколько примеров, которые в будущем вам могут пригодиться. Однажды, интереса ради, я просматривала документацию RxJS и заметила ранее для…

    Читать далее »
  • ХабрахабрФото О маленькой полезной фиче angular

    О маленькой полезной фиче angular

    Недавно появилась задача в одном достаточно крупном проекте ограничивать UI и функционал пользователей, в зависимости от их ролей. К этому моменту приложение уже разрослось на 100+ компонент, и это при том что основные базовые компоненты вынесены в отдельную репу и ставятся пакетом. То есть примерно в каждом из 100+, вероятно придется вносить некоторые правки, связанные с правами доступа. Первой мыслью…

    Читать далее »
  • ХабрахабрФото Как я делал сайт визитку на Angular

    Как я делал сайт визитку на Angular

    Несколько месяцев назад я загорелся желанием написать небольшой pet-проект, который был бы посвящен разработке сайта визитки на Angular. И так как Angular достаточно громоздкий фреймворк, в котором нет SSR* из коробки, да и настройка SEO требует немалых телодвижений**, то сама идея выглядела достаточно сомнительной. Как говорил современник - Выбор — делать дичь, прям лютую грязь-грязь, либо делать грязь, но не…

    Читать далее »
  • ХабрахабрФото Angular без CLI Туториал

    Angular без CLI Туториал

    Фреймворк Angular используется при создании SPA и предлагает большое количество инструментов как для создания, непосредственно, элементов интерфейса, так и CLI для создания и управления структурой файлов, относящихся к приложению. Для создания проекта с использованием библиотеки Angular, официальный сайт предлагает нам установить пакет angular-cli и далее из консоли запустить определенные команды, которые скачают нужные пакеты, создадут нужные файлы и останется только…

    Читать далее »
  • ХабрахабрФото Создать динамический компонент теперь проще: изменения в Angular 13

    Создать динамический компонент теперь проще: изменения в Angular 13

    Бывают ситуации, когда компонент необходимо добавить на страницу динамически. Например, тултип или баннер. В такие моменты на помощь приходит Angular, который умеет создавать компоненты в рантайме и рендерить их. Для этого разработчик может воспользоваться методом createComponent у ViewContainerRef. Но с 13 версией фреймворка API этого метода немного изменился. В этой статье поделюсь тем, как теперь выглядит процесс динамического добавления компонента. Прежде…

    Читать далее »
  • ДайджестФото Дайджест свежих материалов из мира фронтенда за последнюю неделю №507 (13 — 20 февраля 2022)

    Дайджест свежих материалов из мира фронтенда за последнюю неделю №507 (13 — 20 февраля 2022)

    Опрос Хотите рассказать о себе в наших социальных сетях? Мегапост Зарплаты айтишников во втором полугодии 2021 Промо Красивое: смотрим тренды рынка труда в IT вместе с вами

    Читать далее »


Кнопка «Наверх»