Catberry a été développé pour aider à créer des applications Web "isomorphes / universelles".
Pour faire court, les applications isomorphes / universelles sont des applications qui utilisent la même base de code sur les environnements serveur et client pour rendre ce que le client considérerait comme une "application de page unique".
Installez Catberry CLI en utilisant la commande suivante:
npm install -g catberry-cliUtilisez Catberry CLI pour créer un projet vide avec un support de guidon comme celui-ci:
catberry init empty-handlebarsOu un exemple d'application qui fonctionne à l'aide de l'API GitHub:
catberry init exampleEn outre, vous pouvez obtenir une liste de tous les modèles:
catberry init ? Pour plus de détails, veuillez passer à la documentation Catberry.
'use strict' ;
class CoolComponent {
/**
* Creates a new instance of the "CoolComponent" component.
* @param {ServiceLocator} locator The service locator for resolving dependencies.
*/
constructor ( locator ) {
// you can resolve any dependency from the locator.
}
/**
* Gets data for the template.
* This method is optional.
* @returns {Promise<Object>|Object|null|undefined} Data for the template.
*/
render ( ) {
return this . $context . getStoreData ( ) ;
}
/**
* Returns event binding settings for the component.
* This method is optional.
* @returns {Promise<Object>|Object|null|undefined} Binding settings.
*/
bind ( ) {
return {
// CSS selector
'.clickable' : ( ) => window . alert ( 'Ouch!' ) ;
}
}
/**
* Cleans up everything that has NOT been set by .bind() method.
* This method is optional.
* @returns {Promise|undefined} Promise of nothing.
*/
unbind ( ) {
// nothing to do here we have used bind properly
}
}
module . exports = Some ;Le composant est utilisé comme une balise personnalisée:
< cat-cool id =" unique-value " cat-store =" group/CoolStore " > </ cat-cool > 'use strict' ;
class CoolStore {
/**
* Creates a new instance of the "CoolStore" store.
* @param {ServiceLocator} locator The service locator for resolving dependencies.
*/
constructor ( locator ) {
/**
* Current universal HTTP request for environment-independent requests.
* @type {UHR}
* @private
*/
this . _uhr = locator . resolve ( 'uhr' ) ;
/**
* Current lifetime of data (in milliseconds) that is returned by this store.
* @type {number} Lifetime in milliseconds.
*/
this . $lifetime = 60000 ;
}
/**
* Loads data from a remote source.
* @returns {Promise<Object>|Object|null|undefined} Loaded data.
*/
load ( ) {
// Here you can do any HTTP requests using this._uhr.
// Please read details here https://github.com/catberry/catberry-uhr.
}
/**
* Handles an action named "some-action" from any component or store.
* @returns {Promise<Object>|Object|null|undefined} Response to the component/store.
*/
handleSomeAction ( ) {
// Here you can call this.$context.changed() if you're sure'
// that the remote data on the server has been changed.
// You can additionally have many handle methods for other actions.
} ;
}
module . exports = Some ; Alors que Catberry est capable de rendre des pages pour n'importe quel navigateur sur le serveur, en raison de l'utilisation de certaines fonctionnalités HTML5, comme l'API de l'historique, seul la prise en charge partielle des anciens navigateurs est possible pour l'application JavaScript côté client.
L'objectif principal du cadre Catberry est d'utiliser toute la puissance des nouvelles technologies et de fournir à un utilisateur la meilleure expérience possible.
En fait, un utilisateur obtient une page HTML du serveur qu'une seule fois et tout le reste du temps que la page entière change dans un navigateur ne recevant que des données pures de l'API Service (s) utilisé avec l'application.
Grâce au moteur de rendu progressif de Catberry, l'utilisateur reçoit une page du composant du serveur par composant aussi rapidement que chaque composant rend son modèle en attendant la création de la page entière.
Catberry prend en charge 2 dernières versions de navigateurs modernes et IE 11. Cela dépend de Babel Babel-Preset-Env Preset quelle configuration vous pouvez remplacer un fichier .babelrc dans votre projet.
Il existe de nombreuses façons de contribuer à Catberry:
Denis Rechkunov [email protected]