Volt est un framework Ruby conçu pour les applications riches en données. Les côtés serveur et client sont écrits en Ruby (qui est ensuite compilé en JS en utilisant OPAL), ce qui permet au développeur d'écrire des applications très dynamiques sans avoir à écrire une seule ligne de code Javascript. Si vous êtes un Fan de rubis comme moi, vous allez adorer ce cadre.
Dans le but de rendre les applications Web beaucoup plus dynamiques, les frameworks Javascript frontaux comme Angular.js, Backbone.js et Ember.js ont gagné en popularité. Cependant, ces frameworks nécessitent souvent une application back-end pour être utiles, ils sont donc utilisés en conjonction avec des frameworks Web tels que Ruby on Rails et Django.
D'autre part, le framework Ruby Volt est capable de gérer le back-end et un front-end dynamique. Étant donné que les deux fonctionnalités sont étroitement intégrées dans son cœur (en fait, Volt ressemble plus à une architecture MVVM, tirant parti des avantages des liaisons de données), il permet au développeur de créer ces applications rapidement.
Une fonctionnalité très intéressante qui sort de la boîte est la fonctionnalité en temps réel de Volt. Si vous avez déjà créé des applications en temps réel, vous savez que le processus peut être difficile - vous avez probablement mis en œuvre l'interrogation AJAX, les sockets Web, les événements envoyés par le serveur (SSE) ou même utilisé des services externes, ajoutant de la complexité à l'application et même encourant des coûts supplémentaires. . Contrairement à d'autres frameworks, Volt maintient une connexion avec le serveur active (via des sockets Web), donc au lieu de faire des requêtes Ajax pour chaque action, il pousse instantanément les modifications à tous les clients. Aucune configuration n'est nécessaire pour que cela fonctionne.
Dans ce tutoriel sur le framework Ruby, je vais vous expliquer le processus de création d'une application en temps réel à l'aide de Volt, et quoi de mieux qu'une application de chat pour démontrer ses capacités, car le chat reste le cas d'utilisation numéro un des applications en temps réel.
Tout d’abord, installons Volt et MongoDB. Ce dernier processus ne sera pas couvert en détail:
gem install volt brew install mongodb
mkdir -p /data/db
(créer dbpath)
chown `id -u` /data/db (change the owner to have the proper dbpath permissions)
Nous sommes maintenant prêts à créer notre première application, appelons-la 'chat'. Nous pouvons le faire facilement en quelques lignes:
volt new chat cd chat
La structure du document présente certaines similitudes avec Rails. La principale différence que les utilisateurs de Rails remarqueront est que nous avons un dossier supplémentaire dans l'application qui contient le reste des dossiers tels que les actifs, les contrôleurs, les modèles et les vues, ce dossier supplémentaire est un «composant».
Un composant est une section isolée de l'application. Toutes les pages à l'intérieur d'un composant sont rendues sans recharger la page puisque tous les fichiers pour ce composant sont chargés avec la requête http initiale, donc si nous visitons une page d'un composant différent, une nouvelle requête http sera effectuée et la page sera 'rechargée ». Pour cet exemple, utilisons le composant par défaut appelé «main».
Démarrez le serveur en exécutant la commande «volt server» dans la console, et voyons à quoi il ressemble dans le navigateur en accédant à localhost: 3000:
volt server
N'oubliez pas non plus de démarrer MongoDB dans la console:
mongod
Nous pouvons remarquer que Volt est livré avec un certain nombre de pages par défaut, y compris «Accueil» et «À propos». Ceux-ci peuvent être personnalisés immédiatement.
L'autre chose à mentionner est le bouton de connexion en haut à droite de la page. Volt a une fonctionnalité «utilisateur» intégrée au framework via la gemme «volt-user-templates», qui fournit un moyen d’enregistrer et d’authentifier les utilisateurs dès la sortie de la boîte.
Maintenant, commençons à travailler sur notre application. Tout d’abord, nous n’avons pas besoin de la page «À propos de» pour pouvoir supprimer les éléments suivants: Le app/main/views/main/about.html
fichier, l'action about dans app/main/controllers/main_controller.rb
, supprimez le /about
itinéraire en app/main/config/routes.rb
et le lien de navigation dans app/main/views/main/main.html
.
Passons maintenant aux choses sérieuses et commençons par répertorier tous les utilisateurs enregistrés:
{{ if Volt.user }} { } {{ if user._id != Volt.user._id }} {{user._name}} {{ end }} {{ end }} {{ if params._user_id }} { current_conversation.each do } {{ message._text }}
{{ end }} {{ if current_conversation.count == 0 }} You have no messages yet. Start chatting!
{{ else }} {{ end }} Submit {{ end }} {{ else }} This is a sample application built with Volt to demonstrate its real-time capabilities. Please log in to access it.
{{ end }}
Tout d'abord, nous vérifions s'il y a un utilisateur sélectionné avant d'afficher le formulaire, puis nous affichons tous les messages de la conversation en cours (la conversation avec l'utilisateur sélectionné) d'une méthode dans le contrôleur que nous allons définir dans un instant, et en bas, nous affichons un formulaire pour envoyer de nouveaux messages.
Notez que la valeur de l'entrée est un attribut que nous créons sur le modèle de collection de pages, car nous ne voulons pas qu'elle soit stockée dans le magasin de données. Définissons maintenant le current_conversation
et send_message
méthodes dans le contrôleur:
def send_message unless page._new_message.strip.empty? _messages <[{ sender_id: Volt.user._id, receiver_id: params._user_id }, { sender_id: params._user_id, receiver_id: Volt.user._id }] }) end
Dans la méthode send_message, nous ajoutons un nouveau message à la collection si le message n'est pas vide (nous vérifions en ligne pour ne pas avoir à jouer avec les validations pour le moment), puis nous définissons la page ._new_message to ‘’
donc on vide le champ de saisie.
Nous pourrions vouloir ajouter cette ligne à la fin de select_conversation
méthode aussi. La méthode de conversation actuelle interroge simplement le _messages
collection de messages entre l'utilisateur sélectionné et l'utilisateur actuel.
tutoriel angularjs pour les débutants étape par étape
Pour finir, j'aimerais avoir une sorte de système de notification, afin que les utilisateurs puissent voir quand d'autres utilisateurs leur envoient des messages.
Ajoutons une nouvelle collection appelée _notifications
et créez-en un nouveau après l'envoi de chaque message:
def send_message unless page._new_message.strip.empty? _messages << { sender_id: Volt.user._id, receiver_id: params._user_id, text: page._new_message } _notifications << { sender_id: Volt.user._id, receiver_id: params._user_id } page._new_message = '' end end def select_conversation(user) params._user_id = user._id unread_notifications_from(user).then do |results| results.each do |notification| _notifications.delete(notification) end end page._new_message = '' end def unread_notifications_from(user) _notifications.find({ sender_id: user._id, receiver_id: Volt.user._id }) end
De plus, nous devons supprimer les notifications après qu'un utilisateur sélectionne la conversation et voit les nouveaux messages, j'ai donc ajouté cette partie au select_conversation
méthode.
Ajoutons un compteur de notification juste à côté du nom d'utilisateur:
{{user._name}} {{ if unread_notifications_from(user).count > 0 }} {{ unread_notifications_from(user).count }} {{ end }}
Maintenant que l'application est prête, vous pouvez ouvrir quelques navigateurs et commencer à tester les capacités en temps réel de Volt.
Même si le framework Volt n'est pas aussi mature et robuste que la plupart des frameworks Ruby populaires qui existent depuis des années (au moment où Volt est toujours en version bêta), il vaut la peine d'être considéré et étudié.
Si vous êtes intéressé, utilisez ce tutoriel sur le framework Ruby pour faire tourner Volt. Gardez un œil sur les développements ultérieurs, car Volt ressemble à un framework Ruby très prometteur, même à ce stade précoce de développement.
Il y a beaucoup de nouvelles fonctionnalités intéressantes dans le pipeline et je suis sûr que Volt deviendra plus pertinent au cours des deux prochaines années, à mesure que de plus en plus de gens commenceront à l'expérimenter. En raison d'un certain nombre de fonctionnalités innovantes, de nombreux développeurs pourraient tomber amoureux de Volt et l'utiliser pour leur prochain Projet Ruby .