Ulepszanie aplikacji webowej z AngularJS

Dec 3, 2014Download as PPTX, PDF0 likes1,099 views

Tomasz Bak

Porównam na kilku przykładach rozwiązania AJAX / jQuery z alternatywą w postaci AngularJS.

Ulepszanie aplikacji
webowej z AngularJS
Tomasz Bąk

Agenda
● wprowadzenie do AngularJS
● kilka przykładów użycia bibliotek
● mała aplikacja kanban board

AngularJS
● 108 kB
o vs jQuery 1.11 ~ 98 kB
o vs Ember.js 1.8.1 ~ 353 kB
o lodash.js ~ 28 kB
● 32 278★
o vs jQuery 32 672★
o vs Ember.js 11 915★
o vs lodash.js 6 809★

MVC
http://www.mutuallyhuman.com/blog/2014/05/08/angularjs-services-and-factories-done-right/

Wbudowane dyrektywy
ngApp
ngBind
ngBindHtml
ngBindTemplate
ngBlur
ngChange
ngChecked
ngClass
ngClassEven
ngClassOdd
ngClick
ngCloak
ngController
ngCopy
ngCsp
ngCut
ngDblclick
ngDisabled
ngFocus
ngForm
ngHide
ngHref
ngIf
ngInclude
ngInit
ngKeydown
ngKeypress
ngKeyup
ngList
ngModel
ngMousedown
ngMouseenter
ngMouseleave
ngMousemove
ngMouseover
ngMouseup
ngNonBindable
ngOpen
ngPaste
ngPluralize
ngReadonly
ngRepeat
ngSelected
ngShow
ngSrc
ngSrcset
ngStyle
ngSubmit
ngSwitch
ngTransclude
ngValue

ngmodules.org
● tysiące dyrektyw
● wiele z nich opakowuje biblioteki jQuery

AngularJS vs jQuery
● dyrektywy vs bindowanie
● dyrektywy vs operacije na DOM

AngularJS w przykładach
● 2 * 2 = 4
● sortowanie

http://jsbin.com/sopivo/3/edit

http://jsfiddle.net/df5r6c45/4/

Więcej AngularJS w przykładach
● Excel w 20 min
● edycja danych tabelarycznych
● kanban

Ulepszanie aplikacji webowej z AngularJS

vitalets/angular-xeditable
● 18 kB
● 814★

AngularJS sprawdza się do:
● szybko reagującego UI
o edycja danych tabelarycznych
o kanban
o wykresy
● przetwarzania danych przed przesłaniem do serwera
o wytnij i wklej
o kategoryzacja plików

Prezentacja z meetupu Uszanowanko Programowanko #3 http://www.uszanowanko.pl/rubyonrails REvolution - czyli o bardziej obiektowym podejściu w rozwiązaniach kolejowych Framework Ruby on Rails pozwala na szybkie i stosunkowo łatwe tworzenie aplikacji webowych w języku Ruby. Można powiedzieć, że podejście zwane “The Rails Way” w wielu przypadkach zdało swój egzamin. Szybko jednak okazało się, że to podejście nie sprawdza się w przypadku bardziej złożonych systemów. Logika biznesowa w kontrolerach, wypasione modele, logika w szablonach… ogólnie mówiąc chaos. Potrzebna była (r)ewolucja... Autor: Tomek Jasiulek

Introduction to ReactJS - Comparison to AngularJS 2 - Robert Piękoś (pl)Sunscrapers

Diagnozowanie problemów z JavaScriptem na stronie - Techniczne SEOMaria Cieślak

Zastosowanie Google Tag Managera w optymalizacji strony internetowejŁukasz Kołodziejczyk

Historia jednej migracji - Angular 5Przemek Smyrdek

Nowy rok to dobry moment aby wcielić w życie planowane tygodniami zmiany i postanowienia. Moim postanowieniem noworocznym stało się pomyślne przeprowadzenie migracji projektu do Angulara 5. Nie jest to tak popularny cel jak regularne wizyty na siłowni, jednak zapewniam was, że wiąże się on z wysiłkiem na podobnym poziomie. W mojej prezentacji przedstawię powody takiej decyzji, kroki poprzedzające samą migrację oraz to jak ten proces przebiegał w przypadku projektu który współtworzę.

Functional widgets in RailsSebastian Sito

Asynchroniczne testy JavaScript aplikacji webowychFuture Processing

REACT NATIVE - CZYLI ZAPROGRAMUJMY APLIKACJĘ NATYWNĄ W JSTomasz Netczuk

Angular js warsztaty stopień 2Marcin Wosinek

Daj się wyręczyć - Joomla Day Polska 2014Tomasz Dziuda

Worklety i magiczne interfejsy z przyszłościMarcin Gajda

Projekt Houdini ma na celu udostępnienie webdeveloperom niskopoziomowych interfejsów przeglądarki. Oprócz tworzenia bardzo wydajnych, zaawansowanych efektów wizualnych, pozwoli to na dodawanie własnych funkcjonalności do CSS. Podczas prezentacji nie tylko przyjrzymy się tym interfejsom, ale także sprawdzimy – na przykładach – do odprawiania jakich czarów będzie można ich użyć. https://github.com/marcingajda/css-houdini-examples

Pan Oponka - BiografiaFilip Tepper

AngularJS Warsaw #4 - Dariusz Kalbarczyk "Controller as"Dariusz Kalbarczyk

Projektowanie i implementacja usług sieciowychUniversity of Economics in Katowice

Szybkie prototypowanie i development we VueJSThe Software House

Bartosz Magier: Klienci czasem wymagają od nas zawrotnej prędkości w tworzeniu aplikacji. Pewnie nieraz zetknęliście się z problemem stworzenia funkcjonalnego prototypu, który klient może zobaczyć, w którym może poklikać – bo same makiety i grafiki mu nie wystarczają. Na prezentacji dowiecie się, czym jest VueJS, jak szybko przy jego pomocy można tworzyć funkcjonalne prototypy oraz poznacie zalety Vue CLI 3.

Co nowego w ASP.NET MVC 4?tkryskiewicz

Praktyczne porady na temat optymalizacji wydajności aplikacji tworzonych z u...The Software House

Prezentacja z meetupu grupy "Uszanowanko Programowanko", tematyka AngularJS: http://www.uszanowanko.pl/angular Autor: Łukasz Bachman Szybkie prototypowanie aplikacji w AngularJS jest jedną z największych zalet tego narzędzia. Jednakże jako programiści musimy zadbać o to, aby pisane przez nas aplikacje były wydajne zarówno pod względem pamięciowym, jak i czasowym. W mojej krótkiej prezentacji chciałbym przedstawić kilka praktycznych porad, które pomogą to osiągnąć. Całość omówimy na prawdziwym studium przypadku aplikacji przetwarzającej duże zbiory danych.

Równoległy rozwój Aplikacji Webowych | CodesushiKrzysztof (Chris) Ozog

Angular 4 pragmatycznieSages

Kariera it Sopotneoteric-eu

HYC - Angular stań się kanciastymDariusz Jagieło

Podstawy Asp.Net Mvc 1.0 W 3600 Sekundemdzej

Jak przerobić monolityczną aplikację na architekturę mikro serwisów ?Tomasz Lelek

Tworząc architekturę w oparciu o koncepcję mikro serwisów, przed zespołem staje wiele wyzwań. -Budowanie łatwo rozszerzalnej architektury mirkoserwisów. Tworząc nowy serwis, zawsze potrzebujemy danych z innego. Aby je otrzymać wystarczy zaimportować lekkiego klienta, który jest interfejsem innego serwisu. -Jak odpowiednio wykorzystać protokół http, aby zamienić go w swój największy atut i nie próbować ukrywać go niepotrzebnie ? -które funkcjonalności wyciągnąć jako pierwsze ? Jak wykorzystać domain driven design, do modelowania domeny biznesowej, w sposób specyficznych dla danego mikroserwisu ? -Jak zarządzać konfiguracją, i deploymentem wielu serwisów ? -implementowanie wzorca Circuit Breaker, używając biblioteki Netflix Hystrix

Java. Aplikacje bazodanowe. Najlepsze rozwiązaniaWydawnictwo Helion

Aplikacje biznesowe dotyczą danych -- niezależnie od tego, czy są to dane o produkcie, szczegóły dotyczące kart kredytowych użytkowników czy preferowanego koloru kupowanych samochodów. Wraz ze wzrostem znaczenia informacji wzrosła także złożoność dostępu do nich. Programiści Javy mogą wybierać teraz spośród różnego rodzaju interfejsów API i technologii -- EJB, JDO, JDBC, SQL, RDBMS, OODBMS i innych. Do tej pory byli oni zdani na siebie przy podejmowaniu decyzji o tym, który model najlepiej pasuje do ich aplikacji i jak w najlepszy sposób korzystać z wybranego API. Książka "Java. Aplikacje bazodanowe. Najlepsze rozwiązania" przychodzi z pomocą programistom. Teraz nie muszą już oni przeszukiwać kilku książek na temat różnych API, aby zdecydować o odpowiedniej metodzie. Ten obszerny przewodnik omawia podstawy wszystkich wiodących interfejsów API (Enterprise JavaBeans, Java Data Objects, JDBC, a także innych, mniej znanych opcji), objaśnia metodologię i komponenty projektowe wykorzystujące wspomniane interfejsy oraz prezentuje rozwiązania najbardziej dostosowane do różnych typów aplikacji. Książka omawia także zagadnienia dotyczące projektowania baz danych, począwszy od architektury tabel, skończywszy na normalizacji. Autor przedstawia najlepsze rozwiązania rozmaitych problemów. Nauczysz się w jaki sposób przeprowadzać różne rodzaje normalizacji, a także dowiesz się, kiedy warto przeprowadzić denormalizację. Uzyskasz także szczegółowe instrukcje dotyczące optymalizacji zapytań SQL w celu najlepszego wykorzystania struktury bazy danych. Zaprezentowano także praktyczne zastosowania omawianych technik dostarczając informacje, które Czytelnik może zastosować natychmiast we własnych projektach aplikacji biznesowych.

Jaki framework wybraćPaweł Tekliński

Angular 2.0 – Kochaj albo rzuć!The Software House

Ext jsdanon123danon

More Related Content

What's hot (14)

Functional widgets in RailsSebastian Sito

Asynchroniczne testy JavaScript aplikacji webowychFuture Processing

REACT NATIVE - CZYLI ZAPROGRAMUJMY APLIKACJĘ NATYWNĄ W JSTomasz Netczuk

Angular js warsztaty stopień 2Marcin Wosinek

Daj się wyręczyć - Joomla Day Polska 2014Tomasz Dziuda

Worklety i magiczne interfejsy z przyszłościMarcin Gajda

Pan Oponka - BiografiaFilip Tepper

AngularJS Warsaw #4 - Dariusz Kalbarczyk "Controller as"Dariusz Kalbarczyk

Projektowanie i implementacja usług sieciowychUniversity of Economics in Katowice

Szybkie prototypowanie i development we VueJSThe Software House

Co nowego w ASP.NET MVC 4?tkryskiewicz

Praktyczne porady na temat optymalizacji wydajności aplikacji tworzonych z u...The Software House

Równoległy rozwój Aplikacji Webowych | CodesushiKrzysztof (Chris) Ozog

Angular 4 pragmatycznieSages

Functional widgets in RailsSebastian Sito

Asynchroniczne testy JavaScript aplikacji webowychFuture Processing

REACT NATIVE - CZYLI ZAPROGRAMUJMY APLIKACJĘ NATYWNĄ W JSTomasz Netczuk

Angular js warsztaty stopień 2Marcin Wosinek

Daj się wyręczyć - Joomla Day Polska 2014Tomasz Dziuda

Worklety i magiczne interfejsy z przyszłościMarcin Gajda

Pan Oponka - BiografiaFilip Tepper

AngularJS Warsaw #4 - Dariusz Kalbarczyk "Controller as"Dariusz Kalbarczyk

Projektowanie i implementacja usług sieciowychUniversity of Economics in Katowice

Szybkie prototypowanie i development we VueJSThe Software House

Co nowego w ASP.NET MVC 4?tkryskiewicz

Praktyczne porady na temat optymalizacji wydajności aplikacji tworzonych z u...The Software House

Równoległy rozwój Aplikacji Webowych | CodesushiKrzysztof (Chris) Ozog

Angular 4 pragmatycznieSages

Similar to Ulepszanie aplikacji webowej z AngularJS (20)

Kariera it Sopotneoteric-eu

HYC - Angular stań się kanciastymDariusz Jagieło

Podstawy Asp.Net Mvc 1.0 W 3600 Sekundemdzej

Jak przerobić monolityczną aplikację na architekturę mikro serwisów ?Tomasz Lelek

Java. Aplikacje bazodanowe. Najlepsze rozwiązaniaWydawnictwo Helion

Jaki framework wybraćPaweł Tekliński

Angular 2.0 – Kochaj albo rzuć!The Software House

Ext jsdanon123danon

AJAX i PHP. Tworzenie interaktywnych aplikacji internetowychWydawnictwo Helion

Poznaj możliwości technologii AJAX * Utwórz aplikacje działające po stronie klienta i serwera. * Wykorzystaj pliki w formacie XML. * Zaimplementuj mechanizmy "przeciągnij i upuść" na stronach WWW. Technologia AJAX powstała w wyniku połączenia kilku technik, dzięki którym możliwe było ograniczenie do minimum procesu "przeładowywania" stron WWW podczas ich przeglądania przez użytkowników. AJAX, łączący w sobie możliwości języków JavaScript i XML, jest świetnym narzędziem do tworzenia interaktywnych witryn internetowych, które pozwala na zaimplementowanie w nich mechanizmów dotychczas kojarzonych z aplikacjami "tradycyjnymi". Za pomocą technologii AJAX możemy weryfikować dane wprowadzane do formularzy, tworzyć wykresy w czasie rzeczywistym i dodawać do aplikacji internetowych wiele innych, przydatnych funkcji. Książka "AJAX i PHP. Tworzenie interaktywnych aplikacji internetowych" to przewodnik po technologii AJAX i jej możliwościach. Czytając ją, nauczysz się pisać wydajny i łatwy w konserwacji kod AJAX-a, łączyć tę technikę z językiem PHP i bazą danych MySQL oraz tworzyć systemy wielowątkowe. Dowiesz się, jak budować aplikacje WWW, których obsługa nie będzie różniła się od obsługi aplikacji dla systemu Windows. Wykorzystasz możliwości języków SVG i XML do kreowania interaktywnych i dynamicznych elementów witryn WWW, a także poznasz najlepsze praktyki programistyczne dla technologii AJAX. * Korzystanie z obiektowego modelu dokumentu (DOM) * Aplikacje AJAX działające po stronie przeglądarki * Połączenie techniki AJAX z PHP i MySQL * Weryfikacja danych z formularzy * Tworzenie komunikatora internetowego * Dynamiczne tworzenie tabel i wykresów * Przetwarzanie kanałów RSS * Mechanizmy "przeciągnij i upuść" Poznaj najnowocześniejszą technologię tworzenia aplikacji WWW

Single Page Applications przy wykorzystaniu REST3camp

AngularJS (nie) nadaje się do dużego projektu3camp

AngularJS (nie) nadaje się do dużych pojektów.Rafał Filipek

Webinar - Podstawy Node.jsWojciech Kaniuka

Websites vs Cloud Services - OLMUGBart Zaremba

Jak oszczędzać czas zespołu w środowisku mikroserwisów, czyli efektywny flow ...Mateusz Paprocki, PMP

Każdy zespół pracujący w środowisku mikroserwisów boryka się z podobnymi problemami: jak dbać o jakość kodu, organizować feature branche, testować zmiany, budować kolejne wersje aplikacji, zarządzać środowiskami, czy, finalnie, doprowadzić do automatycznych release’ów. W prezentacji przygotowanej przez trójmiejski software house Neoteric zobaczymy jedną z koncepcji rozwiązania problemów. Przygotujcie się na solidną dawkę Jenkinsa, Dockera, GitFlow oraz Sonara!

Obiektowe tworzenie motywów z użyciem silnika szablonów Twig w WordPressieWordCamp Polska

W swojej prezentacji Piotr opowie o rozdzieleniu pracy frontend i backend developera, odseparowaniu warstw prezentacji i logiki dzięki implementacji template’ów Twig, przechowywaniu struktury motywu w bazie danych i ograniczeniu możliwości edycji stron z poziomu wp-admina, tylko do predefiniowanych fragmentów. *** Piotr Niewiadomski podczas WordCamp Lublin 2017: https://2017.lublin.wordcamp.org/session/obiektowe-tworzenie-motywow-z-uzyciem-silnika-szablonow-twig-w-wordpressie/

WordCamp Lublin 2017Piotr Niewiadomski

Środowisko PWAUniversity of Economics in Katowice

MvvmCross na przykładach w Xamarin.AndroidIn'saneLab

JavaServer Faces. Wydanie IIWydawnictwo Helion

Poznaj nowoczesne technologie, aby perfekcyjnie tworzyć sprawne oprogramowanie! * Jak tworzyć aplikacje JSF w środowisku Eclipse? * Jak korzystać z frameworku JBoss Seam? * Jak implementować niestandardowe komponenty, konwertery i mechanizmy weryfikujące? JavaServer Faces (JSF) jest obecnie najpopularniejszą technologią, która pozwala na projektowanie interfejsu użytkownika poprzez umieszczenie na formularzu komponentów i powiązanie ich z obiektami Javy bez konieczności mieszania kodu źródłowego ze znacznikami. Mocną stroną JSF jest rozszerzalny model komponentowy, a także możliwość współpracy z środowiskami do budowy graficznych interfejsów użytkownika metodą przeciągnij-i-upuść. To nowoczesne narzędzie oferuje także mechanizmy rozwiązujące najtrudniejsze problemy w zakresie nawigacji, zarządzania połączeniami z usługami zewnętrznymi i konfiguracjami oraz izolowania prezentacji od logiki biznesowej. Książka &#8222;JavaServer Faces. Wydanie II&#8221; prezentuje gruntownie zaktualizowaną wiedzę dotyczącą JSF oraz wyczerpujące omówienia najnowszych udoskonaleń mechanizmów wiążących tę technologię z platformą Java EE 5, a także analizę rozszerzeń interfejsów API. Zawiera praktyczne porady i wskazówki, dzięki którym szybko nauczysz się technik sterowania przechodzeniem pomiędzy stronami z wykorzystaniem frameworku Shale; poznasz sposoby zastępowania znaczników JSP znacznikami XHTML za pomocą technologii Facelets; do perfekcji opanujesz sztukę rozbudowy tej technologii o własne biblioteki. &#8222;Core JavaServer Faces&#8221; to doskonały, usystematyzowany zbiór najlepszych praktyk budowy oprogramowania, minimalizowania trwale kodowanych elementów i maksymalizacji produktywności. * Komponenty zarządzane * Zaawansowane techniki nawigacji * Znaczniki i formularze * Konwersja i weryfikacja poprawności danych * Implementacja klas niestandardowych mechanizmów weryfikacji * Powidoki i pakiet Apache Tiles * Niestandardowe komponenty, konwertery i mechanizmy weryfikujące * Eliminowanie wycieków połączeń * Uzyskiwanie dostępu do informacji składowych w katalogach LDAP * Implementacja mechanizmu weryfikacji w czasie rzeczywistym z wykorzystaniem frameworku Ajax4jsf Zastosuj nowoczesne technologie JSP, aby w prosty sposób budować zaawansowane i sprawne aplikacje.

Kariera it Sopotneoteric-eu

HYC - Angular stań się kanciastymDariusz Jagieło

Podstawy Asp.Net Mvc 1.0 W 3600 Sekundemdzej

Jak przerobić monolityczną aplikację na architekturę mikro serwisów ?Tomasz Lelek

Java. Aplikacje bazodanowe. Najlepsze rozwiązaniaWydawnictwo Helion

Jaki framework wybraćPaweł Tekliński

Angular 2.0 – Kochaj albo rzuć!The Software House

Ext jsdanon123danon

AJAX i PHP. Tworzenie interaktywnych aplikacji internetowychWydawnictwo Helion

Single Page Applications przy wykorzystaniu REST3camp

AngularJS (nie) nadaje się do dużego projektu3camp

AngularJS (nie) nadaje się do dużych pojektów.Rafał Filipek

Webinar - Podstawy Node.jsWojciech Kaniuka

Websites vs Cloud Services - OLMUGBart Zaremba

Jak oszczędzać czas zespołu w środowisku mikroserwisów, czyli efektywny flow ...Mateusz Paprocki, PMP

Obiektowe tworzenie motywów z użyciem silnika szablonów Twig w WordPressieWordCamp Polska

WordCamp Lublin 2017Piotr Niewiadomski

Środowisko PWAUniversity of Economics in Katowice

MvvmCross na przykładach w Xamarin.AndroidIn'saneLab

JavaServer Faces. Wydanie IIWydawnictwo Helion

More from Tomasz Bak (18)

Design Patterns in ReactTomasz Bak

Building React CRUD app in minutes?Tomasz Bak

This document discusses the admin-on-rest React library for building admin interfaces. It provides a highly configurable React admin panel built on top of popular libraries like Redux, Redux-Form, and Material-UI. The library allows defining resources and their CRUD operations in just a few lines of code. It uses Redux and Redux-Sagas to manage data fetching and updating in a RESTful way. The UI is built from reusable components that can be customized through options and themes.

How to migrate large project from Angular to ReactTomasz Bak

Learn migration strategies for large front-end migration projects with an emphasis on continuous business value delivery. Identify the Bounded Contexts in your application and make your application more modular. * Transform - create a parallel new view * Coexist - leave the existing view for a time, so the functionality is implemented incrementally * Eliminate - remove the old functionality as users stop using it

JAMstackTomasz Bak

e2e testing with cypressTomasz Bak

Cypress is an e2e testing tool that allows for testing web applications directly in the browser. It provides native access to the browser without using Selenium, making tasks like taking screenshots and recording videos possible. Some limitations are that it only supports single-page applications and one browser tab at a time. Cypress prioritizes developer experience through features like fast testing, intuitive debugging, and integration with continuous integration systems and dashboards. Many large companies have adopted Cypress for their e2e testing needs.

How to GraphQL: React ApolloTomasz Bak

How to GraphQLTomasz Bak

Working with npm packagesTomasz Bak

The document discusses working with npm packages. It provides guidance on how to find suitable npm packages based on quality, GitHub activity, and downloads. It outlines steps for modifying existing packages such as forking the repository, making changes locally or as a pull request. The document also describes how to create and publish a new npm package by initializing it with npm, adding metadata to the package.json file, and publishing updates to npm.

How to replace rails asset pipeline with webpack?Tomasz Bak

Functional Reactive Angular 2 Tomasz Bak

Jak wnieść wkład w Open Source?Tomasz Bak

JavaScript PromisesTomasz Bak

The document discusses JavaScript promises and how they can be used to handle asynchronous operations. Promises allow asynchronous functions to return values asynchronously by attaching callbacks to the promise object. This avoids callback hell and makes asynchronous code easier to read and maintain. The document covers how promises can be chained together, executed in parallel, cached, and passed around between functions. It also discusses promise implementations in different frameworks like jQuery, Angular, and how promises can interact across frameworks.

Replacing Rails asset pipeline with GulpTomasz Bak

The document compares the Rails asset pipeline and Gulp for asset management. Both tools concatenate and minify JavaScript and CSS files as well as support preprocessing with CoffeeScript and Sass. Gulp provides additional automated tasks like removing unused CSS, creating image sprites, and checking PageSpeed scores. Integrating Gulp into Rails can be done with plugins like gulp-rev-rails-manifest. The document provides examples of using Gulp for a Rails frontend to isolate assets, commit only installed dependencies to source control, and leverage native frontend package and build systems.

Bardziej produktywny gmailTomasz Bak

KerberosTomasz Bak

Rails tobak2005Tomasz Bak

Ldap novellTomasz Bak

Testowanie JavaScriptTomasz Bak

This document discusses testing JavaScript with the Jasmine testing framework. It provides an overview of why to use JavaScript and Jasmine for testing, how Jasmine integrates well with Rails and supports CoffeeScript. It demonstrates sample tests written in JavaScript and CoffeeScript using Jasmine's matchers and other features. Finally, it provides a link to a GitHub repository with a demo of testing JavaScript with Jasmine.

Design Patterns in ReactTomasz Bak

Building React CRUD app in minutes?Tomasz Bak

How to migrate large project from Angular to ReactTomasz Bak

JAMstackTomasz Bak

e2e testing with cypressTomasz Bak

How to GraphQL: React ApolloTomasz Bak

How to GraphQLTomasz Bak

Working with npm packagesTomasz Bak

How to replace rails asset pipeline with webpack?Tomasz Bak

Functional Reactive Angular 2 Tomasz Bak

Jak wnieść wkład w Open Source?Tomasz Bak

JavaScript PromisesTomasz Bak

Replacing Rails asset pipeline with GulpTomasz Bak

Bardziej produktywny gmailTomasz Bak

KerberosTomasz Bak

Rails tobak2005Tomasz Bak

Ldap novellTomasz Bak

Testowanie JavaScriptTomasz Bak

Ulepszanie aplikacji webowej z AngularJS

1. Ulepszanie aplikacji webowej z AngularJS Tomasz Bąk

2. Agenda ● wprowadzenie do AngularJS ● kilka przykładów użycia bibliotek ● mała aplikacja kanban board

3. AngularJS ● 108 kB o vs jQuery 1.11 ~ 98 kB o vs Ember.js 1.8.1 ~ 353 kB o lodash.js ~ 28 kB ● 32 278★ o vs jQuery 32 672★ o vs Ember.js 11 915★ o vs lodash.js 6 809★

4. MVC http://www.mutuallyhuman.com/blog/2014/05/08/angularjs-services-and-factories-done-right/

5. Data binding

6. Dyrektywy

7. Wbudowane dyrektywy ngApp ngBind ngBindHtml ngBindTemplate ngBlur ngChange ngChecked ngClass ngClassEven ngClassOdd ngClick ngCloak ngController ngCopy ngCsp ngCut ngDblclick ngDisabled ngFocus ngForm ngHide ngHref ngIf ngInclude ngInit ngKeydown ngKeypress ngKeyup ngList ngModel ngMousedown ngMouseenter ngMouseleave ngMousemove ngMouseover ngMouseup ngNonBindable ngOpen ngPaste ngPluralize ngReadonly ngRepeat ngSelected ngShow ngSrc ngSrcset ngStyle ngSubmit ngSwitch ngTransclude ngValue

8. ngmodules.org ● tysiące dyrektyw ● wiele z nich opakowuje biblioteki jQuery

9. AngularJS vs jQuery ● dyrektywy vs bindowanie ● dyrektywy vs operacije na DOM

10. AngularJS w przykładach ● 2 * 2 = 4 ● sortowanie

11. http://jsbin.com/sopivo/3/edit

12. http://jsfiddle.net/df5r6c45/4/

13. http://jsfiddle.net/df5r6c45/4/

14. http://jsfiddle.net/df5r6c45/4/

15. http://jsfiddle.net/df5r6c45/4/

16. Więcej AngularJS w przykładach ● Excel w 20 min ● edycja danych tabelarycznych ● kanban

17. graunked/spreadsheet ● 15 LOC

20. vitalets/angular-xeditable ● 18 kB ● 814★

22. ...

25. esvit/ng-table ● 10 kB ● 1079★

30. a5hik/ng-sortable ● 16 kB ● 194★

36. AngularJS sprawdza się do: ● szybko reagującego UI o edycja danych tabelarycznych o kanban o wykresy ● przetwarzania danych przed przesłaniem do serwera o wytnij i wklej o kategoryzacja plików

37. Q&A

Ulepszanie aplikacji webowej z AngularJS

Recommended

More Related Content

What's hot (14)

Similar to Ulepszanie aplikacji webowej z AngularJS (20)

More from Tomasz Bak (18)

Ulepszanie aplikacji webowej z AngularJS