Angular — налаштування середовища розробки і production складання з AOT-компіляцією і tree-shaking (Gulp, Rollup, SystemJS)

Одна з особливостей Angular, притаманна і першої і нової версії — високий поріг входження. Новий Angular, крім усього іншого, важко навіть запустити. А і запустивши, легко отримати 1-2 Мб скриптів і порядку декількох сотень запитів при завантаженні hello world сторінки. Можна, звичайно, використовувати всякі стартери, seed'и або Angular CLI, але для використання в серйозно проекті потрібно самому у всьому розбиратися.
У цій статті я спробую описати, як створити зручне середовище розробки з використанням SystemJS, і production збірку Angular додатки на основі Rollup, з виходом близько 100кб скриптів і декількох запитів при відкритті сторінки. Використовувати будемо TypeScript і SCSS.
Спробувати все в справі можна в моєму angular-gulp-starter проекті.

Читати далі →

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

imageБагато разів чув твердження, що Angular 2 повинен бути особливо хороший в корпоративних додатках, оскільки він, мовляв, пропонує всі потрібні (і не дуже) прибамбаси відразу з коробки (Dependency Injection, Routing і т. д.). Що ж, можливо це твердження має під собою основу, оскільки замість десятків різних бібліотек розробникам треба освоїти один тільки Angular 2, але давайте подивимося, наскільки добре базова (основна) функціональність цього фреймворку годиться для корпоративних додатків.

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

Читати далі →

Angular vs Angular 2: ключові відмінності

Ми в команді Web Development компанії Itransition вже маємо гарний досвід розробки на Angular 2 і хочемо поділитися ним.

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

NativeScript, що за звір і для чого він потрібен?

Доброго часу доби, хабражітелі, мене звати Володимир Міленко, я frontend-інженер в компанії Иннософт, географічно розташована в місті Иннополис і є резидентом особливої економічної зони р. Иннополис.

Сьогодні я розповім про такого звіра, як NativeScript(так, він змінився, так, сильно).
NativeScript — фреймворк для кроссплатформної розробки, дотримується концепції write once — use everywhere, і, можливо, у нього вийшло!



Читати далі →

Як Ionic 2 допомагає мені вникнути в angular 2

В жовтні я пішов з роботи і почав займатися власним проектом. На початковому етапі моє нове заняття займає максимум чотири години в день і тільки-тільки починає покривати витрати, до написання коду ще далеко, а накопичення згоряють — гарний привід задуматися про тимчасове фрілансі.

Чому я вирішив використовувати Ionic 2
Погортавши upwork я прийшов до висновку, що мій гаряче улюблений angularjs стрімко поступається позиції своєму наступникові. Досить дивне відчуття: ще вчора angular 2 був у беті і буквально за пару місяців після релізу майже наздогнав свого монолітного попередника в количетсве оголошень про розробку веб-додатків! У 22 роки я відчув себе досить старим і вирішив витратити час на те, щоб знову наздогнати моду.

І тут починається: webpack або system.js? Typescript або ES6? Promises або Observables? Щось не так. Почитав, остаточно заплутався. Але зрозумів, що в 2016 про gulp вже краще не згадувати вголос — застыдят.

Зібравшись з думками згадав про свій досвід роботи з гібридними додатками. Так, там було багато болю і сліз, але все ж я з посмішкою згадував Ionic. А тут як раз друга версія начебто цілком стабільна. Хлопці з ionic core team вже подбали про мене, вибравши за мене майже весь стек, налаштувавши конфіги і запропонувавши готову структуру проекту. Це щастя — просто брати і писати код, а потім бачити результати, тримаючи в руках свій телефон. Загорівся і вирішив написати невеликий додаток і викласти його на github.

Читати далі →

Представляємо бібліотеку right-angled, конструктор гридов для angular2



Сьогодні хочемо розповісти про те, як ми вирішили віддати борг open source спільноти і створили бібліотеку right-angled. Тільки вчора ми перевели її в статус beta і вирішили поділитися цією чудовою новиною з Хабрасообществом c самим першим.

Читати далі →

Be King of your state with Angular2 State Machine

image

Управління станом свого програми — цікава і дуже важлива задача для багатьох додатків. Адже від цього залежить те, наскільки чітко і зрозуміло буде побудований користувальницький інтерфейс і наскільки успішним буде сам додаток.

Сьогодні я хотів би розповісти про один цікавий open-source проект, який може полегшити роботу зі станами для тих, хто вирішив написати або переписати свою програму на Angular2 і думає про те, переписувати йому логіку керування станами заново чи варто що-небудь пошукати на теренах цих ваших інтернетів.

Читати далі →

Як я винаходив велосипед, або мій перший MEAN-проект


Сьогодні, у період стрімкого розвитку веб-технологій, досвідченому фронтэнд-розробнику потрібно завжди залишатися в тренді, кожен день поглиблюючи свої знання. А що робити, якщо Ви тільки починаєте свій шлях у світі веб? Ви вже перехворіли версткою і на цьому не хочете зупинятися. Вас тягне в загадковий світ JavaScript! Якщо це про Вас, сподіваюся ця стаття доведеться до речі.
Читати далі →