Débuter avec Parse

Je suis un grand fan de Parse, une technologie qui accélère le développement d'applications Web et mobiles. Il vous permet de stocker, de synchroniser et de transmettre des données dans le nuage sans écrire une ligne de code côté serveur. Poursuivez votre lecture pour voir comment intégrer Parse dans votre prochain projet..

Un peu de fond

Interagir avec la base de données est extrêmement simple!

Faisons un pas en arrière et évaluons où en était le développement Web il y a cinq ans. Nous utilisions des langages tels que PHP / Ruby sur le back-end qui interagissaient avec des bases de données relationnelles (telles que MySQL) et notre interface frontale était encombrée de divers fichiers JavaScript. Je ne sais pas pour vous, mais la plupart de mes projets étaient sur un serveur disposant de peu d'espace disque, de RAM et de bande passante..

De nombreuses nouvelles technologies exploitent le cloud et il n'est pas rare que les développeurs profitent de ces services rentables, tels que AWS, Amazon S3, Heroku, etc. L’introduction de ces services a essentiellement modifié le paysage du développement Web; plus de ce que nous faisons réside dans le nuage.

Aujourd'hui, nous allons examiner Parse, une start-up proposant un système de gestion de données basé sur le cloud. En tirant parti de leurs services, j'ai pu créer rapidement de nouvelles applications mobiles et Web. Nous allons utiliser Parse pour créer l'application Web obligatoire To-do. J'espère que cela vous donnera un avant-goût de ce que le service peut offrir..

Qu'est-ce que Parse?

En termes simples, Parse est un système de gestion de données basé sur le cloud qui vous permet de développer rapidement des applications Web et mobiles..

Cela rend les applications en développement vraiment facile en prenant le dos de vos mains.

Alors, comment ça se passe? Eh bien, supposons que vous soyez un développeur Web. Vous pouvez ajouter le fichier JavaScript Parse sur votre page, obtenir une clé API et commencer à enregistrer des "objets" dans le nuage avec seulement quelques lignes de code. Parse vous libère de la configuration d'une pile côté serveur.

Pensez-y pendant une minute. En règle générale, vous configurez une pile côté serveur (LAMP, RoR, ASP.NET ou autre), configurez une base de données, puis vous interagissez avec celle-ci via Ajax sur le client. Parse vient de réduire tout ce travail à quelques lignes de code.

Dans ce tutoriel, nous utiliserons le SDK JavaScript de Parse. Cependant, vous n'êtes pas limité à l'utilisation de JavaScript. Il existe des bibliothèques Parse dans de nombreux langages, notamment PHP, NodeJS, Java, C #, etc. Vous pouvez trouver toutes les bibliothèques disponibles ici.

Utilisation de l'analyse pour vos projets Web

Avant de commencer, prenons une minute et réfléchissons à la manière de créer une application de liste de tâches traditionnelle à l'aide d'une pile LAMP..

Vous créeriez une base de données MySQL.
Vous pouvez avoir une classe PHP responsable d’exécuter des opérations CRUD. Optionnellement, vous pourriez juste avoir un tas de fonctions PHP.
Vous pouvez utiliser JavaScript et Ajax côté client pour appeler les scripts PHP respectifs et transmettre des chaînes de requête..
Vous devez nettoyer les entrées pour vous protéger contre les attaques XSS et vous soucier de la sécurité des bases de données en général..
S'il s'agit d'une application collaborative, vous devrez suivre différents utilisateurs et gérer leurs listes. Plus de code, plus de tables et plus de schémas.
Vous devez vous assurer que votre base de données reste performante..

Vous avez eu l'idée. Il y a beaucoup de choses à penser et de nombreux domaines pour faire des erreurs. Parse gère ces problèmes pour nous.

Créer un compte d'analyse

Avant de faire quoi que ce soit, créez un compte Parse gratuit. Puis créez une nouvelle application appelée EnvatoTodo.

Téléchargez le projet vide

Parse fournit un excellent guide de démarrage rapide pour vous aider à démarrer. Sélectionnez JavaScript et choisissez EnvatoTodo dans le menu déroulant de l'étape 2 (affiché dans l'image ci-dessous). Parse générera un fichier zip contenant le SDK Parse et index.html.

Le côté client

Avant de commencer à interagir avec Parse, définissons une structure client de base pour notre application. L'interface utilisateur n'étant pas au centre de cette application, je vais simplement vous montrer le code que j'ai utilisé. Ce n'est rien d'extraordinaire, mais j'utilise YUI3. Vous pouvez éventuellement utiliser jQuery. Tout est dedans index.html.

   Todo App construit sur Parse          Todo List construite sur Parse
     
  Tâches incomplètes
  Il n'y a pas de tâches incomplètes! Pensez à en ajouter un ci-dessus.

La chose importante à noter dans le code ci-dessus est l'inclusion du fichier JavaScript Parse, . Ce fichier contient l'objet Parse avec lequel nous allons interagir.

Ajouter des classes dans le navigateur de données

Parse vous libère de la configuration d'une pile côté serveur.

Revenons à Parse. Affichez le navigateur de données pour EnvatoTodo (il est actuellement vide). Le navigateur de données est similaire à un serveur de base de données MySQL, mais la base de données Parse est sans schéma. Bien que vous puissiez spécifier des colonnes dans le navigateur de données, vous pouvez enregistrer n'importe quel objet avec un simple JSON (un peu comme beaucoup de bases de données NoSQL / Document). C’est une caractéristique extrêmement importante et utile de Parse.

Nous allons aller de l'avant et ajouter une "classe" à la base de données. Pensez à une classe comme à une table. La raison pour laquelle on l'appelle une classe est que vous allez généralement créer des objets à partir d'une certaine classe, puis enregistrer cet objet dans la base de données..

Avertissement: JavaScript n'a pas (encore) officiellement de classes, mais son équivalent logique. Par souci de simplicité, je vais utiliser la terminologie "classe" dans ce tutoriel.

Parse a cinq types de cours.

Classes d'utilisateurs stocker des informations spécifiques à l’utilisateur, et Parse fournit des méthodes telles que s'inscrire(), s'identifier(), et plus pour aider avec l'administration des utilisateurs.
Cours d'installation sont généralement utilisés pour envoyer des notifications push pour les applications mobiles. Oui, Parse prend en charge les notifications push à tous les clients..
Classes de rôle aide à séparer les utilisateurs dans des rôles spécifiques, en contrôlant l'accès en lecture / écriture à d'autres classes. Ceci est appelé ACL (liste de contrôle d'accès) dans Parse.
Classes de produits stocker les données de produit dans l'application.
Cours personnalisés sont pour rien d'autre.

Créons une classe personnalisée appelée ListItem. Une fois créé, vous remarquerez qu'il possède déjà quatre propriétés. Parse met automatiquement à jour les propriétés de chaque classe que vous créez. Certaines classes, telles que les classes d'utilisateurs, peuvent avoir leurs propres propriétés spécifiques.

Notre ListItem les objets contiendront un contenu propriété pour montrer ce que le Todo contient, et un est complet propriété pour indiquer si le Todo a été terminé. Nous pourrions ajouter des colonnes pour ces propriétés, mais Parse le découvrira à partir de notre code JSON..

Initialisation de l'analyse

Revenons à index.html ajouter du code. La première chose à faire est d’initialiser Parse avec notre identifiant d’application et notre clé JavaScript. Celles-ci se trouvent sous l'onglet Aperçu de votre application dans le navigateur de données. Ajoutez la ligne suivante à votre JavaScript en remplaçant APP_ID et JS_KEY avec les valeurs appropriées:

Parse.initialize (APP_ID, JS_KEY);

Enregistrer des Todos

Commençons par ajouter des fonctionnalités à notre application. Nous allons d'abord enregistrer un élément de la liste des tâches à effectuer lorsque l'utilisateur clique sur le bouton Ajouter. Le code suivant est tout ce dont nous avons besoin pour cette fonctionnalité:

submitBtn.on ('click', function (e) // Etend la classe native Parse.Object. var ListItem = Parse.Object.extend ("ListItem"); // Instancie un objet de la classe ListItem var listItem = new ListItem (); // listItem est maintenant l'objet que nous voulons enregistrer, nous affectons donc les propriétés souhaitées. ListItem.set ("content", text); listItem.set ("isComplete", false); // Nous appelons la méthode save et passons les fonctions de rappel de succès et d'échec listItem.save (null, succès: function (item) // Rappel de succès, erreur: function (gameScore, error) // Rappel d'échec ););

Interagir avec la base de données est extrêmement simple! Chaque classe personnalisée de Parse hérite de Parse.Object; donc, ListItem est une sous-classe. L'argument de chaîne "ListItem" indique à Parse que cette classe est en corrélation avec la table ListItem que nous avons créée. Ensuite, nous créons un nouveau ListItem objet, définissez ses propriétés et appelez enregistrer().

Affichage des articles

Afin d'afficher une liste d'éléments à faire, nous allons utiliser l'API JavaScript de Parse pour interroger les dix derniers éléments enregistrés et répertorier ceux qui se trouvent sous l'application. Cela vous donnera une idée du fonctionnement des requêtes dans Parse..

// Encore une fois, nous étendons la classe Parse.Object pour rendre la classe ListItem ListItem = Parse.Object.extend ("ListItem"); // Cette fois, nous utilisons Parse.Query pour générer une nouvelle requête, interrogeant en particulier la table ListItem. query = new Parse.Query (ListItem); // Nous définissons des contraintes sur la requête. query.equalTo ('isComplete', false) query.limit = 10; query.descending ('createdAt'); // Nous soumettons la requête et transmettons des fonctions de rappel. query.find (succès: fonction (résultats) // rappel de succès, erreur: fonction (erreur) // rappel d'erreur);

Encore une fois, c'est assez simple et facile à lire. le Parse.Query () la méthode est assez puissante. Ici, nous effectuons une requête assez basique, mais les requêtes Parse peuvent également être complexes. Vous pouvez rechercher des expressions régulières spécifiques, effectuer des requêtes relationnelles, etc. Assurez-vous de consulter la documentation de la requête pour plus d'exemples et d'extraits de code..

Mettre tous ensemble

La prochaine chose à ajouter est la possibilité de marquer une tâche comme complète lorsque vous cochez la case correspondante. Chaque case à cocher a un unique identifiant associé à l'objet Parse qu'il représente. Par conséquent, quand une case à cocher est activée, nous devons:

Obtenir l'identifiant.
Requête pour un objet Parse avec cet identifiant.
Récupère l'objet Parse renvoyé et met à jour son est complet propriété comme vrai.
Enregistrer l'objet mis à jour.
Supprimez-le de la liste affichée.

Voici à quoi ressemble ce code:

incompletItemList.delegate ('clic', fonction (e) // conserve une référence à cette variable self = this; // crée un objet de requête Parse var query = new Parse.Query (ListItem); // le query.get ( Le premier argument de la méthode) est l'objectId qui renvoie l'objet avec cet identifiant. query.get (self.one ('input'). get ('id'), success: function (item) // Si l'objet est renvoyé, nous mettons à jour sa propriété et l'enregistrons. item.set ('isComplete', true); item.save (); // L'élément n'étant plus incomplet, nous le supprimons de la liste. ) // S'il n'y a rien dans la liste, affichez un message indiquant que la liste est vide. , error: function (objet, erreur) alert ("Erreur lors de la mise à jour de l’article à exécuter:" + error.code + "" + error.message);), 'li');

Dans cet extrait, nous interrogeons un élément individuel avec un élément spécifique. identifiant, mettez-le à jour et enregistrez-le. Ensuite, nous le retirons de la liste avec auto.remove ().

Dans Parse, la mise à jour des objets est très similaire à la sauvegarde des objets - nous appelons enregistrer() dans les deux cas. Parse détermine s'il s'agit d'un objet existant (sale) ou d'un objet entièrement nouveau et effectue l'action appropriée..

Code source complet

Avec ça, nous sommes prêts à partir! Assez facile, hein? Téléchargez le fichier ZIP joint et ouvrez index.html pour afficher le code source complet.

Autres caractéristiques

Dans ce tutoriel, nous avons principalement examiné Parse du point de vue du développement Web. Cependant, le service a été initialement créé pour les développeurs mobiles. Parse dispose d'un SDK très complet pour Android et iOS et prend en charge des fonctionnalités telles que les notifications push à tous les utilisateurs de votre application mobile..

Certaines autres fonctionnalités importantes que nous n'avons pas abordées dans ce didacticiel concernent les utilisateurs, les rôles et le stockage d'informations relationnelles..

L'analyse simplifie la création d'utilisateurs et leur attribue différents rôles. Par exemple, dans un système de gestion de l’apprentissage, vous pouvez avoir «Enseignants», «Étudiants» et «Administrateurs». En attribuant des rôles, vous pouvez spécifier quel type d'utilisateur a accès à certains objets d'analyse.

Qu'en est-il de la sécurité?

Beaucoup de nouvelles technologies exploitent le cloud…

En tant que développeur, j'apprécie le fait que Parse règle bon nombre des problèmes de sécurité que j'ai. Comme indiqué sur le site Web, les kits de développement logiciel Parse sont conçus "de sorte que vous n'avez généralement pas à vous soucier de la sauvegarde des données". Il reste le problème des utilisateurs ayant accès à des informations qu'ils ne devraient pas pouvoir utiliser. Pour résoudre ce problème, Parse propose des autorisations au niveau de l'objet et de la classe..

Les autorisations au niveau objet permettent à un développeur de spécifier un tableau d'identifiants d'objet ayant accès à la lecture et / ou à l'écriture de l'objet. Les autorisations au niveau de la classe permettent aux développeurs de spécifier les aspects d’une classe d’analyse pouvant être manipulés à partir de l’API. Les opérations suivantes peuvent être autorisées ou refusées classe par classe: Obtenir, Rechercher, Mettre à jour, Créer, Supprimer et Ajouter des champs.

Avantages et inconvénients

Je tiens à souligner que Parse ne convient pas à tous les types de projets. Bien que le forfait gratuit soit très généreux, Parse est un service payant. Cela peut coûter cher si vous dépassez certaines limites. Heureusement, le modèle de tarification est très transparent et vous devriez pouvoir déterminer le coût de votre application. De manière générale, je l'utilise pour des projets plus petits où je peux anticiper un certain plafond en ce qui concerne le nombre de demandes d'API que je fais. Je n'ai pas encore essayé Parse pour un grand projet.

Un problème commun à un service tel que Parse est l'effet de verrouillage..

Si vous utilisez Parse pour un petit projet qui décolle soudainement, il peut être difficile de passer à un service ou à une plate-forme Différence. Comme vous pouvez l’imaginer, remplacer Parse par votre propre back-end impliquerait un nombre considérable de refactorisations. Cela ne signifie pas que vous ne devriez pas utiliser Parse, mais gardez cela à l'esprit..

Remarques finales

Dans ce didacticiel, nous avons expliqué comment utiliser Parse pour créer une application Web relativement simple. J'ai utilisé ce service pour un certain nombre de projets pour différents clients et je trouve l'équipe de Parse très utile en cas de problème. Je vous encourage à essayer le service et à prendre votre propre décision!

Divulgation: Je n'ai aucune relation avec Parse ni aucun de ses employés. Je ne suis qu'un développeur qui utilise son service et je trouve qu'il s'agit d'un ajout utile à mon flux de travail de développement..

Code