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.

Building a spa_in_30min

1.634 Aufrufe

Veröffentlicht am

In this talk we present the Foxx Framework embedded in ArangoDB.
This talk contains a lot of live-coding and how to write the backend for a Single Page Application in 30 minutes live and on stage.

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

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

Building a spa_in_30min

  1. 1. by Michael Hackstein @mchacki Build a SPA in 30min
  2. 2. Michael Hackstein @mchacki • Member of ArangoDB Core Team • web front-end • graph features • Organizer of cologne.js • Master’s Degree
 (spec. Databases and
 Information Systems)
  3. 3. Single Page Web Applications
  4. 4. The Idea • What if we could talk to the database directly? • It would only need an API • What if we could define this API in JavaScript?
  5. 5. Single Page Web Applications This doesn‘t mean its a Rails/… Killer
  6. 6. Client Server DB
  7. 7. Client Server (optional) DB with Foxx
  8. 8. What is ? • Free and Open Source… • … Document and Graph Store… • … with embedded JavaScript… • … and an amazing query language
  9. 9. / (~( ) ) /_/ ( _-----_(@ @) ( / /|/--| V " " " "
  10. 10. • … a feature of ArangoDB since 1.4 • … an easy way to define REST APIs on top of ArangoDB • … a toolset for developing your single page web application • … not requiring any special code on the client side – use it with Angular, Backbone, Ember,… Foxx is…
  11. 11. Why another solution? • ArangoDB Foxx is streamlined for API creation – not a Jack of all trades • There‘s no communication overhead between (serverside) application and database • It is designed for front end developers: Use JavaScript, you already know that
  12. 12. Live Coding Controller
  13. 13. var FoxxApplication = require("org/arangodb/foxx").Controller; var controller = new FoxxApplication(applicationContext); var db = require("internal").db; var Heroes = require("repositories/heroes").Repository; var Hero = require("models/hero").Model; var heroes = new Heroes(db.heroes, Hero); /** Load random * * Load a random hero */ controller.get("random", function(req, res) { res.json(heroes.random()); }); /** Load hero * * Load a specific hero */ controller.get("superheroes/:id", function(req, res) { res.json(heroes.byId(req.params("id")).forClient()); }).pathParam("id", { type: "string", description: "The key value of a hero" }); /** Replace a hero * * replace a hero with new values */ controller.put("superheroes/:id", function(req, res) { var hero = req.params("hero"); if(hero.get("_key") !== req.params("id")) { throw new Error("Id missmatch"); } heroes.replace(hero); res.json(hero); }).pathParam("id", { type: "string", description: "The key value of a hero" }).bodyParam("hero", "The new values for a hero", Hero) .errorResponse(Error, 400, "Id missmatch");
  14. 14. Foxx.Repository and Foxx.Model
  15. 15. Domain Models Persistence Foxx.Model Foxx.Repository
  16. 16. Foxx.Model Foxx.Repository • Representation of the data • Convenience Methods • Validation • Save and Retrieve Data • Simple Queries • Define your own queries
  17. 17. Why this separation? • It doesn‘t violate the SRP like ActiveRecord • In a lot of cases you can use the standard Repository or Model and don‘t need your own • It‘s great for testing • You can mock the collection and the model prototype to test your Repository • You don‘t need to mock anything to test your model
  18. 18. Live Coding Model & Repository
  19. 19. Modelvar Foxx = require("org/arangodb/foxx"); var Hero = Foxx.Model.extend({ // instance properties },{ attributes: { "_id": "string", "_key": "string", "name": "string", "comment": "string" } }); exports.Model = Hero;
  20. 20. Repository var Foxx = require("org/arangodb/foxx"); var Heroes = Foxx.Repository.extend({ random: function() { return this.collection.any()._key; } }); exports.Repository = Heroes;
  21. 21. Thanks • Please try ArangoDB Foxx • www.arangodb.org • We to get feedback
  22. 22. Contact • mchacki@arangodb.org • @mchacki on Twitter
  23. 23. Thanks • First Slide version by Lucas Dohmen • Andreas Streichardt and Julian Steiner for giving an AngularJS & Foxx Training with me and elaborating the Idea for the App • Database icon designed by Romeo Barreto from The Noun Project • Logos from Node.js, Ruby on Rails, Django, AngularJS and Symfony from the respective projects • All other icons are from Font Awesome

×