Challenge application for UI Bootcamp at Avenue Code, exercising Backbone.js and RequireJS.
- npm install
- bower install
- grunt build
- grunt server (development mode)
- grunt server:dist (production mode)
-
Use your quiz app or fork this repo into your own GitHub account.
-
Create a new Collection for getting the Top Five Users from your persistence / local storage, showing their user names, emails and scores in an array of objects like above. Expose it in the Façade.
[ { name: 'Yoda', email: 'yoda@disney.com', score: 100 }, { name: 'Darth Maul', email: 'dmaul@disney.com', score: 60 }, { name: 'Palpatine', email: 'palpatine@disney.com', score: 40 }, { name: 'Han Solo', email: 'hsolo@disney.com', score: 40 }, { name: 'Jabba The Hut', email: 'jhut@disney.com', score: 20 } ]
-
Create a Sidebar view that will show the Top Five Users (name, email and score) in a sidebar which will always be visible on every page.
-
Create a Mediator (a.k.a. Pub/Sub) to control the communication flow for the following scenario:
-
Every time a user is created or updated, this Sidebar view must be updated.
-
The Sidebar view and the models/collections that manipulate User creation/update must not know about each other.
-
Which means you should use the Mediator to re-render the Sidebar view after a User create/update on your model/collection. You need to setup some channel, publisher and subscriber to make that happen.
-
Remember the way the Mediator works, the Modules MUST NOT contain any reference to the Mediator. It should be the other way around.
-
Create an Observer (a.k.a. Custom Event) to control the communication flow for the following scenario:
-
Create a 'clearAll' function on the User model/collection module to delete all the users from the persistence / local storage.
-
Create a 'clear all' button on this sidebar to call this module.
-
This button should invoke the Module's function via events. You need to setup some event, listener and publisher to make that happen.
-
Differently from the Mediator, the Subject CAN fire the Observers directly.
-
Send me your solution in a GitHub repo.