Рубрика «AngularJS» - 12

В первой части мы перебрали все основные проблемы перехода на новую версию, а в этой мы коснёмся того, ради чего мы это делали.

image

Как говорилось ранее, главной причиной перехода может служить существенное увеличение в скорости работы приложения: в 4.3 раза более быстрые манипуляции с DOM и в 3.5 раза более быстрые циклы $digest (по сравнению с 1.2), как заявили Джеф Кросс и Бриан Форд на конференции ngEurope.

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

Давайте же рассмотрим эти инструменты!

Читать полностью »

Фильтруй правильно, или вредные советы по фильтрации в Angular.Js - 1

Всем привет. Эта статья писалась довольно долго, пару раз переписывалась заново, и, в итоге, меня не устроила. Уж слишком менторский получался тон. А тут, вдруг, грядет пятница, конец спринта, и значит, можно расслабиться. И так, не воспринимайте слишком серьезно, всего лишь несколько советов о том, как готовить фильтры в Angular.JS

Кому интересно или хочется немного расслабиться — вперед под кат и всем хорошей пятницы!
Читать полностью »

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

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

А разгадка кроется в том, что DI во втором ангуляре действительно несколько отличается от других, и связано это в первую очередь с общим подходом и философией 2-й версии. Заключается она в том, что сущностями из которых строится всё приложение, являются компоненты. Сервисный слой, роутер, система внедрения зависимостей — вторичны и они имеют смысл только в рамках компонента. Это очень важный момент, который лежит в основе понимания архитектуры нового фреймворка.

Читать полностью »

Вступление

Эта статья основана на документации Angular 2 и представляет собой перевод двух статей — Вступление и Редактор героя.

Используется Angular 2 release is beta.12.

Тур героев: обзор

Наш великий план — построить приложение для кадрового агентства героев. Даже героям нужна работа!

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

Я бэкенд Java-разработчик, и до фронтенда руки доходят очень редко. Это большое упущение. Отсутствие представления о фронтенде не даёт мне увидеть полную картину мира. Я не знаю, на что обращают внимание и как пользуются всеми модными средствами вроде Node.js, Gulp, Webpack, то есть тем, что так пугает бекенд разработчиков своим разнообразием и постоянными переменами.

И первой моей -жертвой- целью стал Dillinger.io. Это открытый текстовый редактор для Markdown, в нём есть подсветка синтаксиса и экспорт написанного текста в PDF, HTML, Dropbox, Github и Google Drive, также можно добавить собственный способ, к примеру, статический генератор сайтов или WordPress.

Набор фичей звучит достаточно скромно. Но, чтобы в нём разобраться, мне пришлось потратить пару вечеров и прочитать о целом зоопарке технологий. И у этого проекта есть чему поучиться.Читать полностью »

Со стремительным приближением Angular 2.0, параллельно существующим с большим количеством других frontend-фреймворков, в воздухе витает множество волнений по поводу предстоящих затрат (как временных, так и денежных), связанных с переводом своих проектов на новую версию. Как вы думаете, есть ли у разработчиков желание изучить еще один новый фреймворк?

Давайте разбираться. Прошу под кат.
Читать полностью »

image

Angular Attack это 48-ти часовой online hackathon с использованием Angularjs
Читать полностью »

Вдохновившись статьей «Порог вхождения в Angular 2 — теория и практика», решил тоже написать статью про свои муки творчества.

У меня есть большой проект, написанный на ASP.NET WebForms. В нем намешано много всякого, и постепенно мне это всё перестало нравиться. Решил я попробовать переписать всё на чем-нибудь современном. Angular 2 мне приглянулся сразу, и я решил пробовать его. Задача определилась такая: написать новый frontend, прикрутив его к существующему backend, с минимальными переделками последнего. Новый frontend должен быть UI-совместимым со старым, чтобы конечный пользователь ничего не заметил.

Итого имеем такой стэк: backend — ASP.NET Web API, Entity Framework, MS SQL; frontend — Angular 2; тема Bootstrap 3.

Сразу покажу результат TreeView:

image
Читать полностью »

image

EDA – event driven architecture или событийно-ориентированная архитектура. Довольно известный подход к проектированию веб-приложений, который сильно облегчает разработку, когда связанные компоненты находятся на разных ветвях иерархии, делая их связь более прозрачной.

Читать полностью »

Пробрасываем роуты Angular 2 через роутер Laravel 5 - 1
После прочтения статьи "Порог вхождения в Angular 2 — теория и практика" у меня появилось желание показать, как можно пробросить все роуты Angular 2 через роутер Laravel 5.

Идея следующая

  • в директории resources/views/backend будет лежать представление, являющееся точкой входа для всех роутов Angular 2. Для каждого роута Angular 2, роутер Laravel 5 будет нас перенаправлять на это представление;
  • под каждый Angular 2 роут в директиве @RouteConfig нам придется создать копию в роутере Laravel;
  • все роуты Angular 2, по которым подтягиваются шаблоны, будут иметь вид вида /templates/SomeComponent.main, и будут запрашиваться роутером Laravel 5 по пути вида resources/views/frontend/SomeComponent/main.blade.phpЧитать полностью »

https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js