Share
Ce que vous allez créerMalheureusement, Parse.com ferme ses portes le 28 janvier 2017. Dans la série précédente, je vous ai expliqué tout le processus de création d'un système de blogs à partir de zéro. Mais tout était basé sur Parse.com, et si vous utilisez toujours ces techniques, votre site Web cessera malheureusement de fonctionner d'ici là..
Si vous aimez toujours Parse.js (comme moi) et souhaitez continuer à l'utiliser, voici une bonne nouvelle. Les adorables personnes qui y travaillaient ont ouvert le code source afin que nous puissions utiliser notre propre copie sur tous les services d’hébergement Web populaires. Ce tutoriel a pour but de vous aider à effectuer ce changement et à migrer de Parse.com vers votre propre serveur Parse sur Heroku..
Je ne suis pas un expert en back-end, mais c’est la façon la plus simple qui a fonctionné. Si vous voyez des défauts et avez de meilleures méthodes à partager, laissez certainement un commentaire ci-dessous.
Si vous suivez cet épisode, la migration du serveur ne sera pas trop compliquée en soi. Avec Docker, il est même assez facile de configurer un tableau de bord Parse local pour que vous puissiez toujours voir et jouer avec vos données avec facilité..
Cependant, cette série de tutoriels est basée sur la version 1.2.19 de Parse.js; afin de se connecter à un serveur autonome Parse, nous devons mettre à jour l'application pour exécuter la version 1.9.2. Depuis la version 1.5.0, Parse a cessé de prendre en charge Backbone, ce qui signifie que des modifications majeures doivent être apportées au code. Nous allons ajouter Backbone à la page et y utiliser un mélange de Parse et Backbone..
C'est une introduction assez longue, mais n'ayez pas peur. Vous aurez peut-être besoin de déboguer ici et là pendant la migration, mais ça devrait aller. Vous pouvez toujours consulter mon code source ou laisser un commentaire ci-dessous. Cette communauté fantastique fera de son mieux pour vous aider..
Tout d’abord, commençons par créer un serveur Parse. Parse a déjà rendu cela très facile avec un guide de migration détaillé et une longue liste d'exemples d'applications sur toutes les plateformes populaires telles que Heroku, AWS et Azure..
Je vais vous expliquer le plus simple que je connaisse: le combo Heroku + mLab. C'est gratuit au départ, et vous pouvez toujours payer pour un meilleur matériel et plus de stockage dans le même système. Le seul inconvénient est que la version gratuite de Heroku «dormirait» après 30 minutes d'inactivité. Ainsi, si les utilisateurs visitent votre site alors que le serveur est en veille, ils devront peut-être attendre quelques secondes pour que le serveur se réveille avant de pouvoir voir les données. (Si vous consultez la page de démonstration de ce projet et que celui-ci ne rend pas le contenu du blog, c’est la raison. Donnez-lui une minute et actualisez-le.)
Cette partie est largement basée sur le guide de Heroku pour le déploiement d'un serveur Parse et le propre guide de migration de Parse. Je viens de choisir le chemin le plus simple et le plus infaillible.
Si vous n'avez pas encore de compte Heroku, allez-y et créez-en un. C'est une plate-forme très populaire pour le développement et l'hébergement de petites applications Web..
Après vous être inscrit, allez sur votre tableau de bord Heroku et créez une nouvelle application qui sera votre serveur..
Donnez-lui un nom si vous voulez:
Maintenant, vous avez besoin d'une base de données pour stocker les données. Et ajoutons mLab comme add-on.
Aller à Ressources> Add-ons, recherchez «mLab» et ajoutez-le:
Le bac à sable est suffisant pour le développement - vous pouvez toujours mettre à niveau et payer plus pour obtenir plus de stockage là-bas.
Une fois que vous avez ajouté mLab, vous pouvez en saisir l'URI MongoDB..
Aller à Paramètres> Variables de configuration dans votre tableau de bord Heroku et cliquez sur Reveal Config Vars.
Là vous pouvez voir l'URI MongoDB pour votre base de données. Copiez-le, et maintenant nous pouvons commencer à migrer la base de données.
Allez sur Parse.com et trouvez l'application que vous souhaitez migrer. La version open source de Parse Server ne prend en charge qu'une application par serveur. Par conséquent, si vous souhaitez disposer de plusieurs applications, vous devez répéter ce processus et créer plusieurs serveurs. Maintenant, choisissez-en un.
Dans cette application, allez à Paramètres de l'application> Général> Gestion des applications, et cliquez sur Émigrer.
Puis collez l'URI MongoDB que vous venez de copier et lancez la migration.
Bientôt, vous devriez voir cet écran:
Cela signifie que vous devriez maintenant avoir toutes vos données dans votre mLab MongoDB. Assez facile, à droite?
Mais ne finalisez pas encore votre application. Attendons de voir et de jouer avec les mêmes données de notre tableau de bord Parse local, puis revenez en arrière et finalisez-les..
Maintenant, avec la base de données déjà migrée, nous pouvons déployer le serveur Parse.
Si vous n'avez pas encore de compte GitHub, allez-y, créez-en un. C'est probablement l'endroit le plus populaire où les gens partagent et gèrent leur code.
Avec votre compte GitHub, fourchez l'exemple de rapport officiel de Parse Server.
Ensuite, retournez à votre tableau de bord Heroku. Sous Déployer> Méthode de déploiement, choisir GitHub et connectez-vous à votre compte GitHub.
Après cela, recherchez parse et trouvez votre exemple de serveur d'analyse repo et connectez.
Si tout fonctionne, vous devriez le voir être connecté comme ceci:
Maintenant, faites défiler vers le bas de la page. Sous Déploiement manuel, Cliquez sur Déployer la branche.
Vous verrez votre serveur Parse en cours de déploiement et bientôt cet écran:
Clique sur le Vue bouton et vous verrez cette page:
Cela signifie que votre serveur fonctionne maintenant avec bonheur! Et l'URL que vous voyez est l'URL de votre serveur. Vous en aurez besoin plus tard.
Je sais qu'il est incroyable de voir cette simple ligne et de savoir que le serveur est opérationnel. Mais croyez-moi, la centrale est en marche là-bas. Et votre application peut déjà lire et écrire.
Si vous voulez vérifier, vous pouvez exécuter quelque chose comme ceci:
$ curl -X POST \ -H "X-Application-Id: ApplicationId" \ -H "Content-Type: application / json" \ -d '' \ https://example.herokuapp.com/parse / functions / hello… "result": "Hi"%
Si vous êtes un ninja en ligne de commande, tout ira bien d’ici. Mais si vous êtes comme moi et appréciez l'interface conviviale de Parse Dashboard, suivez cette partie pour configurer votre propre Parse Dashboard sur votre ordinateur local, afin de pouvoir visualiser et lire vos données Parse de la manière dont vous êtes habitué..
Encore une fois, vous pouvez installer votre tableau de bord de plusieurs façons. Je vais simplement vous montrer la manière la plus simple de mon expérience, en utilisant Docker.
Si vous n'avez pas Docker, installez-le d'abord (Mac | Windows).
Il met tout un environnement dans une boîte, vous n’avez donc pas besoin de suivre le didacticiel d’installation locale assez compliqué ni de parcourir les étapes du Terminal..
Avec votre menu fixe en cours d'exécution, clonez le référentiel Parse Dashboard sur votre ordinateur et accédez à ce référentiel..
$ git clone https://github.com/ParsePlatform/parse-dashboard.git Clonage dans 'parse-dashboard'… remote: Comptage d'objets: 3355, terminé. à distance: total 3355 (delta 0), réutilisé 0 (delta 0), paquet réutilisé 3354 Réception d'objets: 100% (3355/3355), 2,75 Mio | 2,17 MiB / s, fait. Résolution des deltas: 100% (1971/1971), terminé. $ cd parse-dashboard /
Pour les débutants GitHub absolus, il suffit de le télécharger au format zip.
Décompressez-le et placez-le dans un endroit dont vous vous souviendrez. Ouvrez votre application de terminal si vous êtes sur Mac, tapez CD (vous avez besoin d’un espace après cd) et faites glisser le dossier dans.
Puis frappe Entrer.
Vous devriez voir quelque chose comme ça, et cela signifie que vous êtes au bon endroit.
~ $ cd / Utilisateurs / moyicat / temp / parse-dashboard-master ~ / temp / parse-dashboard-master $
Maintenant, vous pouvez vérifier rapidement si votre Docker est installé correctement en collant cette commande:
docker -v
Si cela indique la version sur laquelle vous êtes, comme ceci:
Docker version 1.12.5, build 7392c3b
C'est installé, et vous pouvez continuer.
Si au lieu de cela, il dit:
-bash: docker: commande introuvable
Vous devez vérifier si vous avez installé Docker correctement.
Lorsque Docker est correctement installé, collez cette commande et appuyez sur Entrer:
docker build -t parse-dashboard .
Cela vous construira une image locale (n'hésitez pas à ignorer le jargon de docker) pour Parse Dashboard.
Vous verrez beaucoup de lignes défiler. Ne paniquez pas, donnez-y un peu de temps et vous le verrez se terminer par quelque chose comme ceci:
Eda023ee596d construit avec succès
Cela signifie que vous avez terminé - l'image a été construite avec succès.
Si vous exécutez le images de docker commande, vous le verrez là:
ETIQUETTE DE REPOSITORY ID IMAGE CREEE TAILLE parse-dashboard dernière eda023ee596d Il y a environ une minute 778.1 MB
Maintenant, ce n'est qu'une image, et ce n'est pas encore un serveur actif. Quand il fonctionne, nous voulons qu’il soit connecté au serveur Parse et au MongoDB que nous venons de construire..
Pour ce faire, nous devons d’abord créer quelques clés dans Heroku afin qu’il puisse dire à qui accorder l’accès aux données..
Accédez à votre tableau de bord Heroku et accédez à Réglages > Variables de configuration encore. Cette fois, il faut y ajouter deux variables: APP_ID et PASSE-PARTOUT. APP_ID peut être quelque chose de facile à retenir, tout PASSE-PARTOUT mieux vaut être un mot de passe très long et compliqué.
Maintenant, avec ces clés, nous pouvons écrire un simple fichier de configuration dans le répertoire racine de votre dossier Parse Dashboard. Vous pouvez utiliser tout de vim à TextEdit ou Bloc-notes-l'objectif est de faire un texte brut config.json fichier avec ce contenu:
"apps": ["serverURL": "your-app-url / parse", "appId": "votre-app-id", "masterKey": "your-master-key", "appName": " votre-app-nom "]," utilisateurs ": [" utilisateur ":" utilisateur "," pass ":" pass "]
Et bien sûr, remplacer votre-app-url avec l’URL du lien «Afficher» (la page indiquant «Je rêve d’être un site Web»), mais conservez le / parse là à la fin; remplacer votre-app-id et votre-clé-maître avec les variables de configuration que vous venez d'ajouter; et donnez un nom à votre application et remplacez votre-app-nom avec ça.
Enregistrez le fichier et lancez le ls commande dans Terminal pour vous assurer de mettre le config.json au bon endroit.
~ / temp / parse-dashboard-master $ ls CHANGELOG.md Dockerfile PIG / Procfile bin / package.json src / webpack / CONTRIBUTING.md LICENCE Parse-Dashboard / README.md config.json scripts / testing / "
Si tu vois config.json dans cette liste, vous êtes prêt à passer à autre chose.
Maintenant, lancez le pwd commande pour obtenir l'endroit où vous vous trouvez:
$ pwd / Utilisateurs / moyicat / temp / parse-dashboard-master
Copier ce chemin.
Collez ensuite cette commande pour créer un conteneur Docker (à nouveau, vous pouvez ignorer ce jargon) et exécutez votre tableau de bord d'analyse. N'oubliez pas de remplacer mon chemin par le chemin que vous venez de recevoir.
docker run -d \ -p 8080: 4040 \ -v /Users/moyicat/temp/parse-dashboard-master/config.json:/src/Parse-Dashboard/parse-dashboard-config.json \ -e PARSE_DASHBOARD_ALLOW_INSECURE_HTTP = 1 \ --name parse-dashboard \ parse-dashboard
De haut en bas, cette commande effectue les opérations suivantes (que vous pouvez également ignorer):
L1: Indiquez à Docker de démarrer un conteneur. L2: Faites-le fonctionner sur le port 8080. Vous pouvez le remplacer par le port de votre choix. L3: Récupérez le fichier config.json que vous venez de créer. L4: Activez HTTPS sur votre réseau local ( sinon vous rencontrerez un message d'erreur) L5: Donnez-lui un nom dont vous vous souviendrez. Vous pouvez aussi changer ce que vous voulez. L6: Indiquez à Docker l'image que vous souhaitez utiliser. parse-dashboard est le nom que nous avons utilisé précédemment dans la commande de construction de docker.
Si tout se passe bien, une longue chaîne vous sera renvoyée sans message d'erreur. Comme ça:
4599aab0363d64373524cfa199dc0013a74955c9e35c1a43f7c5176363a45e1e
Et maintenant, votre tableau de bord Parse est lancé! Découvrez-le à http: // localhost: 8080 /.
Il peut être lent et afficher une page vierge au départ, mais laissez-lui quelques minutes et vous verrez un écran de connexion:
Maintenant, vous pouvez vous connecter avec utilisateur comme nom d'utilisateur et passer comme mot de passe, il est défini dans le config.json au cas où vous ne vous en êtes pas rendu compte plus tôt. Vous pouvez les changer pour ce que vous voulez, aussi.
Et vous verrez cette interface familière sur votre ordinateur local et pourrez jouer avec vos données (maintenant dans mLab MongoDB) comme vous le faites toujours.
Quelques dernières notes sur ce tableau de bord local:
Premièrement, vous pouvez arrêter et démarrer ce conteneur à tout moment à tout moment avec ces deux commandes:
docker arrêter parse-dashboard docker démarrer parse-dashboard
Ainsi, lorsque vous redémarrez votre ordinateur, vous n'avez pas besoin de suivre les étapes précédentes, il suffit de lui dire de recommencer..
Et deuxièmement, si vous avez plusieurs serveurs Parse, vous n'avez pas besoin de créer plusieurs tableaux de bord Parse. Ajoutez simplement plusieurs applications dans le config.json comme ça:
"apps": [// info pour le premier serveur "serverURL": "", "appId": "", "masterKey": "", "appName": "", // info pour le deuxième serveur " serverURL ":" "," appId ":" "," masterKey ":" "," appName ":" "]," utilisateurs ": […],
Chaque fois que vous apportez des modifications à config.json, vous devez redémarrer le conteneur Docker:
docker restart parse-dashboard
Et ensuite, vous verrez les modifications que vous avez apportées.
Jouez maintenant avec votre nouveau tableau de bord Parse, et si tout fonctionne, vous pouvez maintenant revenir à Parse.com et finaliser la migration..
Ensuite, si vous vérifiez vos applications et votre tableau de bord, vous constaterez qu’ils s’adressent tous magiquement à votre nouveau serveur sans problème..
C'est bien! Je souhaite qu'il puisse rester ainsi et que nous puissions terminer ce tutoriel plus tôt. Mais comme je l’ai dit, votre ancienne application Parse.js s’appuie toujours sur les serveurs de Parse.com pour la diriger vers le nouveau serveur approprié. Et cela cessera de fonctionner après le 28 janvier 2017.
Pour le faire fonctionner à l'infini (croisement du doigt), nous devons cesser d'utiliser les clés JavaScript pour pointer vers l'application (qui s'appuie sur Parse.com pour savoir sur quelle base de données pointer), et directement vers notre serveur d'analyse..
Commençons par mettre à jour le fichier Parse.js que nous utilisons dans index.html.
Au lieu d'utiliser la version 1.2.19:
Passer à la nouvelle version:
Ajoutons aussi lodash et Backbone. Maintenant que Parse a cessé de supporter Backbone, nous devons l'inclure pour continuer à utiliser les vues et le routeur..
Ensuite, allons dans site.js.
La première chose à faire est de mettre à jour le Parse.initialize () fonctionne de sorte qu'il pointe vers votre propre serveur Parse.
Auparavant, cela peut ressembler à ceci:
Accentsconagua
Parse.initialize ("HC87tn6aA7c3sYx9X0vwwLVXeqHDRMYYmrUBK5zv", "3piNGGnRMhvWo8u9pKD9TDc1MJlWhlvK78Vr3fHo"); Maintenant, pointez-le sur votre serveur Parse.
Parse.initialize ("moyicat-parse-blog-git"); // Le nom de votre application Parse.serverURL = 'https://moyicat-parse-blog-git.herokuapp.com/parse'; // l'URL de votre serveur Passons maintenant, faisons une mise à jour rapide pour changer tous les Parse.View, Parse.Router, et Parse.history à Backbone.View, Backbone.Router, et Colonne vertébrale.histoire. Ceux-ci ne sont plus pris en charge par Parse, nous avons donc besoin d'une solution de secours.
Ce n'est pas la chose la plus agréable au monde à mélanger et assortir Classe comme ça, mais si vous voulez apporter le moins de modifications possible à votre code et le faire fonctionner, c'est peut-être le moyen le plus simple..
aller chercher à trouver Maintenant, une autre chose que Parse a cessé de supporter est Collection. Et c'est beaucoup plus épineux que les trois autres. Passer de Parse.Collection à Backbone.Collection ne fonctionnera pas. Nous devons réécrire la logique en utilisant les requêtes Parse.
Je vais utiliser le Les blogs collection à titre d'exemple pour vous montrer comment nous pouvons mettre à jour notre blog pour qu'il fonctionne avec le nouveau Parse.js.
Auparavant, nous avons d'abord défini un Classe pour Les blogs:
Blogs = Parse.Collection.extend (modèle: Blog, requête: (new Parse.Query (Blog)). Décroissant ('createdAt')); Et puis dans le BlogRouter.start () fonction nous avons créé une instance de cette classe pour contenir la collection de blocs.
this.blogs = nouveaux blogs ();
Après cela, nous appelons chercher () sur cette collection pour obtenir des données de blogs. Comme dans BlogRouter.index ():
this.blogs.fetch (succès: fonction (blogs) …, erreur: fonction (blogs, erreur) …);
Maintenant, nous pouvons simplement supprimer cette déclaration de classe et faire BlogRouter.blogs une requête Parse:
this.blogs = new Parse.Query (Blog) .descending ('createdAt'); Et quand on l'appelle, au lieu de chercher () nous utilisons trouver().
this.blogs.find (succès: fonction (blogs) …, erreur: fonction (blogs, erreur) …);
Cette partie peut prendre un certain temps car nous avons plusieurs cas d'utilisation différents sur cette série. Vous aurez peut-être besoin de déboguer un peu, même si les données sont correctement extraites, le rendu de la page ne sera pas encore correct. Si vous préférez que les éléments soient rendus au fur et à mesure que vous les corrigez, lisez-les jusqu'à la fin, puis commencez à modifier votre code et à mettre au point le débogage..
Lorsque toutes les données sont récupérées correctement, la prochaine chose à vérifier est les données que vous transmettez dans votre Vue objets.
Auparavant, nous pouvions transmettre tout ce que nous voulions à un objet View. Dans cet exemple, nous avons passé le Nom d'utilisateur directement dans le blogsAdminView afin que nous puissions accueillir les utilisateurs par leurs noms d'utilisateur.
var blogsAdminView = new BlogsAdminView (nom d'utilisateur: currentUser.get ('nom d'utilisateur'), collection: blogs); Cela cesserait également de fonctionner lorsque nous changerons la Vue être prolongé du Backbone.View objet. Nous ne pouvons que passer modèle et collection à présent.
Nous devons donc passer à la utilisateur actuel comme modèle:
var blogsAdminView = new BlogsAdminView (model: currentUser, collection: blogs);
Et changer le BlogsAdminView en conséquence.
Encore une fois, vous devrez peut-être tester et déboguer un peu pour que tout fonctionne correctement.
Et enfin, entre les changements de version, la structure de données de l'objet d'analyse a également changé un peu.
Avant, chaque objet ressemblait à ceci:
objectId: ", titre:",…,
Maintenant, voici la nouvelle structure:
id: "// objectId, attributs: title:",…,,…,
Cela signifie que nous devons également mettre à jour nos modèles de guidon pour restituer correctement les nouvelles données:
Par exemple, précédemment pour les catégories de la barre latérale, nous avons écrit le modèle suivant:
Maintenant, nous devons mettre à jour objectId être id et prénom être attributs.nom.
Maintenant, votre page va rendre.
Encore une fois, si vous ne vous souvenez pas très bien de la logique du site, il vous faudra peut-être sauter un peu plus loin. Si vous êtes bloqué, vous pouvez toujours vérifier mon code source.
Voilà. J'espère que cela pourra vous aider à sauvegarder vos données avant la fermeture de Parse.com ou à raviver votre code lorsque vous en aurez besoin. Vous perdrez toutes les données après le 28 janvier 2017, mais si vous mettez à jour le code, il fonctionnera à nouveau..
Encore une fois, je suis incroyablement triste que Parse.com ne fonctionne plus et que cette série de tutoriels ne fonctionne pas pour les nouveaux arrivants (à moins qu'ils ne renvoient à cette dernière partie). Mais j'espère que cela a aidé quelques personnes à apprendre à coder un site Web.
À partir de ce moment, que vous choisissiez de migrer ou d'apprendre une nouvelle langue, c'est à vous de décider. J'espère que ce sera un peu plus facile car vous avez appris quelques concepts utiles ici.
Meilleurs vœux! Et laissez-moi un commentaire si vous trouvez cette série utile.
