Diese Präsentation wurde erfolgreich gemeldet.
Wir verwenden Ihre LinkedIn Profilangaben und Informationen zu Ihren Aktivitäten, um Anzeigen zu personalisieren und Ihnen relevantere Inhalte anzuzeigen. Sie können Ihre Anzeigeneinstellungen jederzeit ändern.
D7 + API + Angular
DrupalCamp Oslo 2013
Henrik Akselsen
Developer
Mostly backend
@FrontHenrik
Om Frontkom
Per André Rønsen

Marco Fernandes

CIO/Chief Innovation Officer

Senior Web developer

Fredrik Paus

Élio Cró

Jan-Helge H...
Våre kontorer

Fredrikstad, Norway

Funchal, Portugal
“Vi trenger en
webløsning for
magasinet vårt”
- Flere kunder
Case: Newsfront
= Frontend for magasiner
Prinsipper
KJAPP

GOD ADMIN

Prinsipper
ENKEL
THEMING

API
Drupal 7

GOD ADMIN

★ God på admin/backend. The best.™
★ Avhengig av caching for å være kjapp //
Finnes bedre verktøy for...
Decoupling
Rett verktøy til rett jobb
I’m backend!

I’m frontend!

Best of breed for hver del = Prinsippene
ivaretas + unngå SPOF*
Flat HTML?
WGET + RSYNC (tenk: Jekyll møter Boost)
Newsfront (v0.1)
API-basert!
Power to the client
Arkitektur backend
Decoupled, performant, stable & nice

Oh Yeah™

Admin
repo

Site 1
API

Site 2

Client repo
Whoops, vi har allerede
et API!
Solr som database
Solr som db: Why?
1.
2.
3.
4.
5.
6.

Brukes for søk, ingen ny teknologi
Stabil Drupal-integrasjon ut av boksen
Solr er ras...
JSON fra Solr
Frontend
Angular.js
Rammeverk: Angular.js
MVC for frontend!
Når velger vi Angular.js?
●
●
●
●

For moderne frontend-heavy prosjekter
Kan bruke...
Hvorfor Angular?
1. Vi trengte ingen serverbasert løsning (en
annen app tar seg av betalingsmur etc)
2. “HTML for web apps...
Markup med Angular
Speed
Speed
Frontend candy
Grunt!
Phantom.js!
Snacks
Admin
Drupal
Fokus på redaktør
Få moduler
Mange små features
Workbench
Scald
Drupal på sitt beste
Responsive preview, Drupal
Summa summarum
Resultat
Supersnappy
Lave serverutgifter
Enkel å videredesigne
No Varnish
API for tredjepart
Deilig Drupal backend
SaaS
Bo...
One more thing….
Frontmag
THX
@frontkom
@fronthenrik
@perandre
www.newsfront.no
www.frontmag.no
Nächste SlideShare
Wird geladen in …5
×

Presentasjon av Newsfront. Case study med Drupal, Angular og Solr

1.869 Aufrufe

Veröffentlicht am

Presentasjon av Newsfront, en publiseringsløsning for aviser og magasiner bygget for lynkjapp navigering på mobile enheter.

Veröffentlicht in: Technologie
  • Als Erste(r) kommentieren

  • Gehören Sie zu den Ersten, denen das gefällt!

Presentasjon av Newsfront. Case study med Drupal, Angular og Solr

  1. 1. D7 + API + Angular DrupalCamp Oslo 2013
  2. 2. Henrik Akselsen Developer Mostly backend @FrontHenrik
  3. 3. Om Frontkom
  4. 4. Per André Rønsen Marco Fernandes CIO/Chief Innovation Officer Senior Web developer Fredrik Paus Élio Cró Jan-Helge Hansen COO/Project Manager Web Developer Infrastructure / support Thor André Gretland Roberto Ornelas Support & Training CTO Senior developer Fábio Neves Geir Gulland Hélder Mendes Bruno Campos CEO / Web strategist Web Designer Web developer Frank Gjertsen Elisabeth Gulland Wilma Web Designer Accountant QA Engineer ;) Henrik Akselsen JS/Mobile UX Web developer
  5. 5. Våre kontorer Fredrikstad, Norway Funchal, Portugal
  6. 6. “Vi trenger en webløsning for magasinet vårt” - Flere kunder
  7. 7. Case: Newsfront = Frontend for magasiner
  8. 8. Prinsipper
  9. 9. KJAPP GOD ADMIN Prinsipper ENKEL THEMING API
  10. 10. Drupal 7 GOD ADMIN ★ God på admin/backend. The best.™ ★ Avhengig av caching for å være kjapp // Finnes bedre verktøy for API // Ikke sterk på kjapp theming (no Twig)
  11. 11. Decoupling Rett verktøy til rett jobb
  12. 12. I’m backend! I’m frontend! Best of breed for hver del = Prinsippene ivaretas + unngå SPOF*
  13. 13. Flat HTML? WGET + RSYNC (tenk: Jekyll møter Boost)
  14. 14. Newsfront (v0.1)
  15. 15. API-basert! Power to the client
  16. 16. Arkitektur backend Decoupled, performant, stable & nice Oh Yeah™ Admin repo Site 1 API Site 2 Client repo
  17. 17. Whoops, vi har allerede et API! Solr som database
  18. 18. Solr som db: Why? 1. 2. 3. 4. 5. 6. Brukes for søk, ingen ny teknologi Stabil Drupal-integrasjon ut av boksen Solr er rask Skalerer (testet med benchmarks) Enkel hosting med websolr.com Viser seg at The Guardian har gjort noe lignende … vi gjorde noen POC, og: det funka!
  19. 19. JSON fra Solr
  20. 20. Frontend Angular.js
  21. 21. Rammeverk: Angular.js MVC for frontend! Når velger vi Angular.js? ● ● ● ● For moderne frontend-heavy prosjekter Kan brukes direkte mot API Ekstrem fleksibilitet, men enkelt Når man allerede har en backend
  22. 22. Hvorfor Angular? 1. Vi trengte ingen serverbasert løsning (en annen app tar seg av betalingsmur etc) 2. “HTML for web apps”: Enkelt 3. Angular har sterk community backing (+ Google) 4. Ser ut til å “vinne” over Ember.js. Smartere enn Backbone for store apps. 5. Kjent og kjært: Vi har allerede brukt Angular for andre ting
  23. 23. Markup med Angular
  24. 24. Speed
  25. 25. Speed
  26. 26. Frontend candy Grunt! Phantom.js!
  27. 27. Snacks
  28. 28. Admin
  29. 29. Drupal Fokus på redaktør Få moduler Mange små features Workbench Scald Drupal på sitt beste
  30. 30. Responsive preview, Drupal
  31. 31. Summa summarum
  32. 32. Resultat Supersnappy Lave serverutgifter Enkel å videredesigne No Varnish API for tredjepart Deilig Drupal backend SaaS Bonus: Frontend funker med WP++
  33. 33. One more thing….
  34. 34. Frontmag
  35. 35. THX @frontkom @fronthenrik @perandre www.newsfront.no www.frontmag.no

×