Обновить
23.09

Angular *

JavaScript-фреймворк

Сначала показывать
Порог рейтинга
Уровень сложности

Все, что вам нужно знать об обнаружении изменений в Angular

Время на прочтение8 мин
Количество просмотров91K
Наткнулся на хорошую статью об устройстве Angular'овского механизма обнаружения изменений (change detection). Т.к. тема достаточна важна, но при этом недостаточно глубоко раскрыта даже на англоязычных ресурсах, а найти русскоязычные материалы на эту тему, вообще, не представляется возможным, решил перевести данную статью.
Перевод под катом

Первые шаги к Web SCADA-системе. Оживляем мнемосхему в браузере с помощью AngularJS

Время на прочтение8 мин
Количество просмотров19K
Сегодня мы поговорим об отображении мнемосхем технологических объектов в браузере посредством таких технологий как SVG, JavaScript и т.д.

Опишем, что мы хотим получить:

  • Мнемосхема открывается в браузере. Графика – SVG.
  • Вверху мнемосхемы кнопки переходов на другие мнемосхемы.
  • Данные обновляются раз в секунду.
  • По клику на изображение выключателя появляется окно, из которого его можно включить или отключить.

SCADA-система (точнее её серверная часть) позволяет добавлять пользовательские html-страницы. Я не буду вручную набирать код страницы, а нарисую простую схему в редакторе, потом покажу, что получилось и как это работает.
Читать дальше →

Дружим Angular с Google (Angular Universal)

Время на прочтение6 мин
Количество просмотров29K

Дружим Angular с Google


Google ненавидит SPA


Когда мы говорим про современные интернет магазины, мы представляем себе тяжелые для понимания серверы, рендрящие тысячи статических страничек. Причем именно эти тысячи отрендеренных страниц одна из причин, почему Single Page Applications не прижились в электронной коммерции. Даже крупнейшие магазины электронной коммерции по-прежнему выглядят как куча статических страниц. Для пользователя это нескончаемый цикл кликов, ожиданий и перезагрузки страниц.


Читать дальше →

Книга «Стек MEAN. Mongo, Express, Angular, Node»

Время на прочтение7 мин
Количество просмотров20K
image Обычно при веб-разработке на всех уровнях стека используются разные языки программирования. База данных MongoDB, фреймворки Express и AngularJS и технология Node.js вместе образуют стек MEAN — мощную платформу, на всех уровнях которой применяется всего один язык: JavaScript. Стек MEAN привлекателен для разработчиков и бизнеса благодаря простоте и экономичности, а конечные пользователи любят MEAN-приложения за их скорость и отзывчивость.

JavaScript достиг зрелости. Благодаря ему теперь можно создать веб-приложение от начала до конца с помощью всего одного языка программирования. Стек MEAN включает в себя лучшие в своем классе технологии в данной области. В качестве БД вы получаете MongoDB, в качестве серверного фреймворка веб-приложений — Express, в качестве клиентского фреймворка — AngularJS, а в качестве серверной платформы — Node.

Эта книга познакомит вас с каждой из этих технологий, а также с тем, как заставить их работать вместе в качестве стека. На протяжении этой книги мы создаем работающее приложение, сосредотачиваясь по очереди на каждой технологии, наблюдая, как она вписывается в общую архитектуру приложения. Так что эта книга ориентирована на практику, на то, чтобы вы освоились со всеми перечисленными технологиями и их совместным использованием.
Читать дальше →

Как изменить закрытую информационную систему под себя без привлечения вендора. Решение нерешаемых задач с Google Chrome

Время на прочтение9 мин
Количество просмотров9.2K

В крупном бизнесе нередко случаются ситуации, когда внедряются и используются заведомо ущербные информационные системы. Эти проекты начинаются как крутая собственная разработка компании, под её процессы, с учётом всех особенностей. Но уже после сдачи выясняется, что то тут, то там недоделки, несуразности. Что необходимые отчёты и графики получить невозможно, поскольку их не смогли или забыли учесть в ТЗ. Руководство требует, потом просит что-нибудь сделать, но система закрыта для изменений, а подрядчик находится с нами в процессе арбитражной тяжбы. Однако, безвыходных ситуаций конечно же не бывает.
Читать дальше →

Интернационализация (i18n) в Angular 2

Время на прочтение5 мин
Количество просмотров33K
Для создания мультиязычных интерфейсов Ангулар предлагает использовать механизм разметки HTML шаблонов специальным маркером i18n который после компиляции удаляется из финального кода. Для этого достаточно указать этот маркер как атрибут тега окружающего текст.
Читать дальше →

Воссоздание подтаблицы в таблице на AngularJS

Время на прочтение6 мин
Количество просмотров6K

Здраствуйте! Хотел бы поделиться с вами разработкой подтаблиц для нашего веб проекта. Цель заключалась в воссоздании веб модуля, имитирующего таблиц и подтаблиц (subdatasheet) созданных на базе Аccess. Наш клиент привык работать на Access'e, но времена меняются, и теперь наша задача заключается в гладком переходе на веб платформу, с минимальной разницей.


Почему AngularJS?


Имея не много опыта с различными javascript библиотеками, пришел к выводу что AngularJS изначально принуждает вашему проекту быть маленьким, чистым, изолированным и легко расширяемым. Также, используя directive со своим изолированным скопам (scope), дает возможность многоразового применения, даже внутри себя. Что и будет продемонстрировано под катом.


Как наш итоговый directive будет применяться


Так как в нашем проекте будет много таких подтаблиц, нам нужно сделать удобным нашу утилиту в применении. Должно быть примерно таким:


<div ng-controller="ctrl1">
    <subgrid config="config1"> </subgrid>
</div>

Посмотрите демо здесь. Кому интересно прошу под кат.


Читать дальше →

CEF, ES6, Angular 2, WebPack 2 .Net Core десктопное приложение без серверной части

Время на прочтение6 мин
Количество просмотров11K
Это продолжение статей:

CEF, ES6, Angular 2, TypeScript использование классов .Net Core. Создание кроссплатформенного GUI для .Net с помощью CEF
CEF, Angular 2 использование событий классов .Net Core

Основная идея этих статей — создание кроссплатформенных приложений на CEF с использованием Angular 2 и .Net Core. Чтобы отвязаться от сервера, используем свежий WebPack и настроим на локальное использование файлов.
Читать дальше →

Обзор 5 самых популярных JavaScript фреймворков и библиотек 2017

Время на прочтение5 мин
Количество просмотров97K
Популярность JavaScript продолжает расти. В 2016 году мы стали свидетелями больших изменений с выходом полного апгрейда AngularJS и анонсом Angular 2, окончательного первенства jQuery, который применяют в 96,5% всех сайтов, эволюции ECMAScript, двух обновлений Node.js в апреле и октябре соответственно, и даже более того. Чего ожидать от 2017 года? Вот то, что мы знаем к этому времени: Angular 4 ожидается в марте 2017, выпуск ES2017 планируется в середине 2017, релиз Bootstrap v4 также ожидается в этом году.



Недавно JavaScript занял место среди лучших языков для изучения по версии IBM в 2017 году. На данном этапе он используется, как для клиентской, так и для серверной части и помогает проектировать привлекательные интерфейсы, обогащать веб-приложения многочисленными функциями и фичами, изменять веб-страницы в реальном времени и много другое.
Читать дальше →

Angular 1.x: крадущийся webpack, затаившийся grunt

Время на прочтение12 мин
Количество просмотров15K

История о том, как мы поменяли сборку проекта с grunt на webpack


Приходишь на работу, открываешь IDE, пишешь npm start, запуская систему сборки, начинаешь работать. Тебе удобно ориентироваться в структуре проекта, удобно отлаживать код и стили, очевидно, как именно и в каком порядке собирается проект.

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

Как выяснилось, такое случается, если не модернизировать систему сборки вместе с ростом проекта. Хорошая новость в том, что это успешно лечится! Летом мы подтвердили это в бою и хотим поделиться опытом.


Читать дальше →

CEF, Angular 2 использование событий классов .Net Core

Время на прочтение8 мин
Количество просмотров6.9K
Это продолжение статьи CEF, ES6, Angular 2, TypeScript использование классов .Net Core для расширения возможностей.

Как и ожидалось, она не привлекла особого внимания. Но огромное спасибо тем, кого заинтересовало моё творчество. Именно вы даете мне стимул на продолжение изысканий.

Хочу немного остановиться на CEF.

Это кроссплатформенный браузер (с ядром используемым Google Chrome), с неограаниченными расширениями за счет использования натива на С++, позволяющее писать полноценное крооссплатформенное декстопное приложение с UI.

Кроме того Chrome 57 принесёт поддержку языков C и C++ для веб-сайтов

Сегодня я покажу как использовать события объектов .Net Core классов в Angular 2.
Многие прочитав мою первую статью приводили довод, что вместо использования классов .Net можно использовать HTTP сервисы.

Но вот с событиями мы можем делать полноценное декстопное приложение используя торговое оборудование, обмен данными по различным протоколам, использование мессенджеров итд итп.

Для примера возьмем класс с событиями.
Читать дальше →

CEF, ES6, Angular 2, TypeScript использование классов .Net Core. Создание кроссплатформенного GUI для .Net с помощью CEF

Время на прочтение21 мин
Количество просмотров11K
Меня все спрашивают — «Зачем это нужно?». На что, я гордо отвечаю — «Я в 1С использую для доступа к торговому оборудованию, к Вэб-сервисам по ws-протоколам, готовым компонентам. 1С, Linux, Excel, Word, OpenXML,ADO и Net Core. Кроме того, сделаю передачу JS объектов на сторону .Net с использованием через DynamicObject.

Можно сделать определенную конфигурацию CEF для всех платформ и можно делать кросспалатформенные декстопные приложения. Как аналог Electron. .Net Core развивается и можно достаточно легко перевести приложения под WPF и UWP на Angular 2» сделав описание классов и использовать IntelliSense при кодировании на TypeScript.

Но я прекрасно понимаю, что это всего лишь высокопарные слова, и мало кому это нужно. Но мне чертовски интересно, особенно после программирования на 1С.
Читать дальше →

Создаем шаблонизируемые переиспользуемые компоненты в Angular 2

Время на прочтение9 мин
Количество просмотров32K
image Много раз слышал утверждение, что Angular 2 должен быть особенно хорош в корпоративных приложениях, поскольку он, мол, предлагает все нужные (и не очень) прибамбасы сразу из коробки (Dependency Injection, Routing и т. д.). Что ж, возможно это утверждение имеет под собой основу, поскольку вместо десятков разных библиотек разработчикам надо освоить один только Angular 2, но давайте посмотрим, насколько хорошо базовая (основная) функциональность этого фреймворка годится для корпоративных приложений.

По моему опыту, типовое корпоративное приложение — это сотни (иногда тысячи) практически идентичных страниц, которые лишь слегка отличаются друг от друга. Думаю, не мне одному приходила в голову мысль, что неплохо бы выделить повторяющийся функционал в отдельный компонент, а специфичное поведение определять через параметры и внедряемые шаблоны. Давайте посмотрим, что Angular 2 может нам предложить.
Читать дальше →

Ближайшие события

Чистый javascript.Тестирование. Форматирование. Комментарии

Время на прочтение5 мин
Количество просмотров14K
Читать дальше →

Чистый javascript. Объекты и структуры данных. Асинхронность. Обработка ошибок

Время на прочтение4 мин
Количество просмотров23K
Читать дальше →

AngularJS vs Angular 2: ключевые различия

Время на прочтение6 мин
Количество просмотров86K
Мы в команде Web Development компании Itransition уже имеем хороший опыт разработки на Angular 2 и хотим им поделиться.

Эта статья ориентирована на тех крутых ребят, которые разрабатывают на Angular и подумывают перейти на вторую его версию.
Читать дальше →

Чистый javascript.Классы

Время на прочтение8 мин
Количество просмотров38K
Читать дальше →

Чистый javascript.Функции

Время на прочтение11 мин
Количество просмотров34K
Читать дальше →

Чистый javascript.Переменные

Время на прочтение2 мин
Количество просмотров27K
Читать дальше →

Чистый javascript.Введение

Время на прочтение1 мин
Количество просмотров30K
Прочитав книгу Райана Макдермота clean-code-javascript, решил написать серию статей по переводу этой книги.

Оглавление:



image

Читать дальше →