ElitePartner: Mobile mit AngularJS und REST

1,586 views

Published on

Folien zur Veranstaltung "ElitePartner: Mobile mit AngularJS und REST" vom 10.12.2013.
http://youtu.be/kkIcWLJtGSE

Wir stellen hier unsere neue mobile Webseite unter dem Motto "Tech Stack - pants down" vor.

Inhalte sind unter anderem (Achtung Buzzword Bingo):

- AngularJS (JavaScript)
- REST(ful) API
- Logstash + Graylog2
- Build Infrastruktur
- CI / Testing Prozess (incl. "On-Device-Testing")
- Lessons learned

Published in: Technology
0 Comments
2 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
1,586
On SlideShare
0
From Embeds
0
Number of Embeds
66
Actions
Shares
0
Downloads
17
Comments
0
Likes
2
Embeds 0
No embeds

No notes for slide

ElitePartner: Mobile mit AngularJS und REST

  1. 1. ElitePartner „Tech Stack – Pants Down” AngularJS + REST Marcel Sauer, Head of Software Development, ElitePartner Oliver Ochs (@oochs), Leitung Geschäftsfeld Architektur, Holisticon Oliver Zeigermann (@DJCordhose), Entwickler, Autor, Ninja ElitePartner ist die beliebteste Partnervermittlung (DISQ 06/2012) 10.12.2013 1
  2. 2. ElitePartner Inhalt Mobile @ ElitePartner – Iphone, Android (kurze Vorstellung der App(s)) – m.elitepartner.de Tech Stack – Frontend: AngularJS – Backend: REST(ful) API – Build Process – Testing – Unit / e2e / on-device – CI (Build Prozess) – Deployment Process (TC, Capistrano, Puppet) – Logging Lessons Learned ElitePartner ist die beliebteste Partnervermittlung (DISQ 06/2012) 2
  3. 3. ElitePartner Mobile @ ElitePartner Mobile ElitePartner ist die beliebteste Partnervermittlung (DISQ 06/2012) 3
  4. 4. ElitePartner iPhone ElitePartner ist die beliebteste Partnervermittlung (DISQ 06/2012) 4
  5. 5. ElitePartner Android ElitePartner ist die beliebteste Partnervermittlung (DISQ 06/2012) 5
  6. 6. ElitePartner m.elitepartner.de ElitePartner ist die beliebteste Partnervermittlung (DISQ 06/2012) 6
  7. 7. ElitePartner Persönlichkeitstest ElitePartner ist die beliebteste Partnervermittlung (DISQ 06/2012) 7
  8. 8. ElitePartner Persönlichkeitstest ElitePartner ist die beliebteste Partnervermittlung (DISQ 06/2012) 8
  9. 9. ElitePartner Persönlichkeitstest ElitePartner ist die beliebteste Partnervermittlung (DISQ 06/2012) 9
  10. 10. ElitePartner Persönlichkeitstest ElitePartner ist die beliebteste Partnervermittlung (DISQ 06/2012) 10
  11. 11. ElitePartner Angular.js HTML enhanced for web apps! ElitePartner ist die beliebteste Partnervermittlung (DISQ 06/2012) 11
  12. 12. ElitePartner Angular.js  Client-Side MVC-Framework  Reiches HTML ala Web-Components  2-Wege Bindung von Modell und UI  Erlaubt SPA und Offline-Modus  Grundlage für mobilen Persönlichkeitstest  Komplette Anwendung  inkl. HTML-Templates in Modulen minifizierte JS-Files ~ 75kB ElitePartner ist die beliebteste Partnervermittlung (DISQ 06/2012) 12
  13. 13. ElitePartner ElitePartner ist die beliebteste Partnervermittlung (DISQ 06/2012) 13
  14. 14. ElitePartner REST  Backend in Java und Tomcat  MongoDB für Test-Daten  Endpunkte mit Jersey  Authentisierung über oauth mit Spring-Security  Übertragung im JSON-Format  Typisierung im JavaScript-Client über TypeScript ElitePartner ist die beliebteste Partnervermittlung (DISQ 06/2012) 14
  15. 15. ElitePartner ElitePartner ist die beliebteste Partnervermittlung (DISQ 06/2012) 15
  16. 16. Buildprozess Bild: CC BY-SA by Tony Buser
  17. 17. ElitePartner Node.js Werkzeuge basieren auf Node.js und dem „Node Packaged Modules“ Package Manager „npm“ ElitePartner ist die beliebteste Partnervermittlung (DISQ 06/2012) 17
  18. 18. ElitePartner ElitePartner ist die beliebteste Partnervermittlung (DISQ 06/2012) 18
  19. 19. ElitePartner Yeoman Yo generiert das Grundgerüst für eine neue Anwendung, schreibt eine entsprechende GruntKonfiguration und trägt nötige Abhänigkeiten für NPM und Bower ein. ElitePartner ist die beliebteste Partnervermittlung (DISQ 06/2012) 19
  20. 20. ElitePartner Bower Bower wird für das Dependency-Management verwendet. So müssen keine Scripte von Dritten heruntergeladen und eingecheckt werden. ElitePartner ist die beliebteste Partnervermittlung (DISQ 06/2012) 20
  21. 21. ElitePartner Bower Dependencies ElitePartner ist die beliebteste Partnervermittlung (DISQ 06/2012) 21
  22. 22. ElitePartner GRUNT Grunt wird als Buildsystem zum Testen, für Previews und zum Build verwendet. Es gibt eine Vielzahl von grunt-contributions (PlugIns). ElitePartner ist die beliebteste Partnervermittlung (DISQ 06/2012) 22
  23. 23. ElitePartner Verwendete NPMs ElitePartner ist die beliebteste Partnervermittlung (DISQ 06/2012) 23
  24. 24. ElitePartner JSHint Überprüft Best-Practices und unsere Coding Conventions, definiert in “.jshint.rc”. ElitePartner ist die beliebteste Partnervermittlung (DISQ 06/2012) 24
  25. 25. ElitePartner UseMin Baut Gruntfile und kümmert sich um Konkatenierung, Minifizierung (Uglify.js, CSSMin, HTMLMin) und Fingerprinting/Revving. Bild: Dr. E Brown Enterprises, http://www.xconsoles.com/ ElitePartner ist die beliebteste Partnervermittlung (DISQ 06/2012) 25
  26. 26. ElitePartner UseMin ElitePartner ist die beliebteste Partnervermittlung (DISQ 06/2012) 26
  27. 27. ElitePartner Compass Sass / Compass für CSS Preprocessing und Spriting. ElitePartner ist die beliebteste Partnervermittlung (DISQ 06/2012) 27
  28. 28. ElitePartner Plato ElitePartner ist die beliebteste Partnervermittlung (DISQ 06/2012) 28
  29. 29. ElitePartner Testing ElitePartner ist die beliebteste Partnervermittlung (DISQ 06/2012) 29
  30. 30. ElitePartner Unit-Tests mit Jasmine describe("Jasmine", function() { it("makes testing JavaScript awesome!", function() { expect(yourCode).toBeLotsBetter(); }); }); ElitePartner ist die beliebteste Partnervermittlung (DISQ 06/2012) 30
  31. 31. ElitePartner ElitePartner ist die beliebteste Partnervermittlung (DISQ 06/2012) 31
  32. 32. ElitePartner E2E-Tests mit Angular-Scenario ElitePartner ist die beliebteste Partnervermittlung (DISQ 06/2012) 32
  33. 33. ElitePartner Karma-Server Durch einen Karma-Server lassen sich echte Browser fernsteuern. ElitePartner ist die beliebteste Partnervermittlung (DISQ 06/2012) 33
  34. 34. ElitePartner Karma-Server ElitePartner ist die beliebteste Partnervermittlung (DISQ 06/2012) 34
  35. 35. ElitePartner Karma-Server ElitePartner ist die beliebteste Partnervermittlung (DISQ 06/2012) 35
  36. 36. ElitePartner ElitePartner ist die beliebteste Partnervermittlung (DISQ 06/2012) 36
  37. 37. ElitePartner Coverage ElitePartner ist die beliebteste Partnervermittlung (DISQ 06/2012) 37
  38. 38. ElitePartner CI - Teamcity ElitePartner ist die beliebteste Partnervermittlung (DISQ 06/2012) 38
  39. 39. ElitePartner ElitePartner ist die beliebteste Partnervermittlung (DISQ 06/2012) 39
  40. 40. ElitePartner Puppet ElitePartner ist die beliebteste Partnervermittlung (DISQ 06/2012) 40
  41. 41. ElitePartner Testumgebung ElitePartner ist die beliebteste Partnervermittlung (DISQ 06/2012) 41
  42. 42. ElitePartner CI - Teamcity ElitePartner ist die beliebteste Partnervermittlung (DISQ 06/2012) 42
  43. 43. ElitePartner CI - Teamcity ElitePartner ist die beliebteste Partnervermittlung (DISQ 06/2012) 43
  44. 44. ElitePartner ElitePartner ist die beliebteste Partnervermittlung (DISQ 06/2012) 44
  45. 45. ElitePartner Capistrano ElitePartner ist die beliebteste Partnervermittlung (DISQ 06/2012) 45
  46. 46. ElitePartner Logging ElitePartner ist die beliebteste Partnervermittlung (DISQ 06/2012) 46
  47. 47. ElitePartner Logging ElitePartner ist die beliebteste Partnervermittlung (DISQ 06/2012) 47
  48. 48. ElitePartner Logging ElitePartner ist die beliebteste Partnervermittlung (DISQ 06/2012) 48
  49. 49. ElitePartner Learnings JS für Java-Entwickler Turnaround Zeiten Tool-Support (WebStorm, Chrome Dev Tools) HTML5-Support auf Mobile Devices Design (responsive / adaptive) & Styling RESTful API CI-Prozess ElitePartner ist die beliebteste Partnervermittlung (DISQ 06/2012) 49
  50. 50. ElitePartner Demo www.elitepartner.de/mobile ElitePartner ist die beliebteste Partnervermittlung (DISQ 06/2012) 50
  51. 51. ElitePartner Danke Fragen Diskussionen P.S.: We are hiring ;-) https://www.elitepartner.de/jobs/ EliteMedianet GmbH  Am Sandtorkai 50  20457 Hamburg www.ElitePartner.de  www.ElitePartner.de/Magazin  www.ElitePartner.de/Forum  www.ElitePartner-Akademie.de ElitePartner ist die beliebteste Partnervermittlung (DISQ 06/2012) 51

×