BeefJS is a React/Flux architecture friendly micro framework. It also contains a few abstractions of jQuery to simplify API calls.
Beef.Router.routes({
'url/slug': function() {
console.log('when the slug matches');
},
'with/{id}': function(data) {
console.log('got', data.id);
}
});
$(window).on('hashchange', Beef.Router.doRouting);
Beef.Api.get(url, {param: 'value'}).success().error()
var MY_API_URL = '/api/v1/users/{userId}/';
Beef.Api.get(MY_API_URL, {userId: 1}).success().error(); //will replace {userId} with the given param
Beef.Api.get('/my/url', {userId: 1}); //final url would be /my/url?userId=1
#Store
var MyStore = Beef.Store.create({
dispatchIndex: Beef.Dispatcher.register(function(payload) {
})
});
MyStore.upsertRow('todos', 'id', 1, {
id: 1,
title: 'My Title',
desc: 'My Description'
});
MyStore.getRows('todos'); //[{id: 1, title: 'My Title', desc: 'My Description}]
var byTitle = MyStore.getRows('todos').sort(MyStore.sortBy('name', 'ASC'));
var MyStore = Beef.Store.create({
schema: {
Todo: {
title: {
type: 'string'
},
desc: {
type: 'string'
}
}
},
createTodo: function(title, description) {
return MyStore.sanitize({
title: title,
desc: description
}, MyStore.schema.Todo);
}
});
You an also add validation to the schema, which when passed through the validator will return the object, or an array of errors if it isn't valid.
var MyStore = Beef.Store.create({
schema: {
Todo: {
title: {
type: 'string'
},
desc: {
type: 'string',
validation: {
minLength: 5,
maxLength: 10,
required: true,
isNotLoremIpsum: function(value) {
return value !== 'Lorem Ipsum';
}
}
}
}
}
});
var MyStore = Beef.Store.create({
events: {
UPDATE: 'MyStore.events.UPDATE'
},
createToDo: function() {
MyStore.emit(MyStore.events.UPDATE);
}
});
var onUpdate = function() {
console.log('updated');
};
MyStore.listen(MyStore.events.UPDATE, onUpdate);
MyStore.ignore(MyStore.events.UPDATE, onUpdate);
Beef.Dispatcher.register(function(payload) {
var event = payload.event;
var data = payload.data;
switch(event) {
case 'SOME_ACTION':
console.log('SOME_ACTION took place', data.some);
break;
}
}, []);
Beef.Dispatcher.dispatch('SOME_ACTION', {
some: 'data'
});