Construire votre démarrage utiliser des itinéraires pour planifier avec moi

Ce que vous allez créer

Ce tutoriel fait partie de la Construire votre démarrage avec la série PHP sur Envato Tuts +. Dans cette série, je vous guide dans le lancement d’une startup du concept à la réalité en utilisant mes Planificateur de réunion application comme exemple de la vie réelle. À chaque étape du processus, je publierai le code de Meeting Planner sous forme d’exemples open source à partir desquels vous pourrez apprendre. Je traiterai également les problèmes liés au démarrage au fur et à mesure qu'ils surviennent.

Récemment, j'ai demandé si notre série de démarrage a inspiré toutes vos idées entrepreneuriales et vous a aidé à écrire du code. Si oui, s'il vous plaît partagez un peu avec nous dans les commentaires.

Page de rendez-vous, visitez mon horaire avec moi

Cela faisait longtemps que je commençais ce projet, je souhaitais que Meeting Planner et Simple Planner aient une page accessible au public que vous pouvez partager avec des personnes pour planifier une réunion avec vous. En d'autres termes, "Bien sûr, rencontrons-nous, visitez mon calendrier avec moi à Meeting Planner, je m'appelle Bernie Sanders (pas d'espace)." 

Dans le tutoriel d'aujourd'hui, je vais vous montrer que je l'ai fait en utilisant le routage de Yii et certains des problèmes liés qui ont été soulevés.

Si vous n'avez pas encore essayé de planifier une réunion, vous pouvez voir comment cela se passe dans cette vidéo:

 

La page Schedule With Me ressemblerait à la page PayPal Pay Me:

Je participe aux commentaires ci-dessous, alors dites-moi ce que vous en pensez! Vous pouvez également me joindre sur Twitter @lookahead_io. Je suis particulièrement intéressé si vous voulez de nouvelles fonctionnalités ou suggérer des sujets pour de futurs tutoriels..

Pour rappel, tout le code pour Meeting Planner est écrit dans le framework Yii2 pour PHP. Si vous souhaitez en savoir plus sur Yii2, consultez notre série parallèle Programmer avec Yii2.

Commençons.

Planifier l'horaire avec moi

Remarque: Bernie n'est pas réellement un utilisateur de Meeting Planner, pour autant que je sache.

Chaque utilisateur de Meeting Planner a un nom d'utilisateur unique, par exemple. berniesanders, et j’ai décidé de l’utiliser pour l’horaire avec moi. Il y avait quelques défis à cette fonctionnalité:

  1. Concevoir la page
  2. Utilisation de Yii Routing pour mapper un chemin racine sur chaque personne
  3. Gestion de l'inscription, de la connexion et du retour à la planification

Concevoir la page

Inspiré par la page PayPal Pay Me (ci-dessus) et par d’autres similaires, je voulais au départ garder les choses simples. J'ai utilisé une grille réactive avec des décalages et un centrage:

Voici la vue /frontend/views/meeting/scheduleme.php pour la page:

avatar <> ") echo ''; echo \ cebe \ gravatar \ Gravatar :: widget (['email' => $ user-> email, 'options' => ['class' => 'image-profil' , 'alt' => $ user-> nom d'utilisateur,], 'size' => 128,]);?>

user-> isGuest) ?> $ utilisateur-> nom d'utilisateur])?>

Le code affiche l'image de profil que l'utilisateur a téléchargée dans les paramètres utilisateur ou utilise un Gravatar général..

Bien sûr, j'ai utilisé /frontend/web/css/site.css pour personnaliser les marges, la bordure et l'arrière-plan:

.scheduleme-top margin-top: 8%;  .schedule-me background-color: # f3f3f3; largeur minimale: 500px; remplissage: 100px 25px 65px 25px; bordure: 1px solide # e0e0e0;  // ajustements réactifs @média uniquement écran et (min-device-width: 320px) et (max-device-width: 667px) et (-webkit-min-device-ratio-pixel: 2) … schedule-me  largeur minimale: 75%; remplissage: 60px 10px 40px 10px; 

Gestion des modifications de routage Yii

Le routage permettant à Yii de gérer les demandes entrantes du navigateur est traité dans /frontend/config/main.php sous composants. Si vous ne faites pas attention à la configuration, vous pouvez détruire l’ensemble de votre application car les demandes entrantes échouent dans les pages d’erreur..

Voici le routage précédent avant la planification avec moi:

 [… 'UrlManager' => ['class' => 'yii \ web \ UrlManager', 'enablePrettyUrl' => true, 'showScriptName' => false, // 'enableStrictParsing' => false, 'rules' => [ 'place' => 'place', 'place / yours' => 'place / yours', 'place / create' => 'place / create', 'place / create_geo' => 'place / create_geo', 'place / create_place_google '=>' place / create_place_google ',' lieu / vue /'=>' place / view ',' place / update /'=>' place / update ',' place /'=>' place / slug ','/'=>'/vue', '//'=>'/',' daemon /'=>' démon /', // incl huit caractère action' site /'=>' site /', // incl huit action de caractère' features '=>' site / features ',' about '=>' site / about ',' wp-login | wp-admin '=>' site / neverland ','/'=>' meeting / identity ', // note - les actions actuellement avec 8 lettres et aucun paramètre échoueront'/'=>'/',],

J'ai déjà un peu écrit sur les itinéraires dans Comment programmer avec Yii2: Sluggable Behavior, qui fait partie de notre série de programmes Yii, et vous pourrez en savoir plus sur la documentation de Yii..

Dans Construire votre démarrage: réunions avec plusieurs participants, j'ai écrit deux épisodes sur les chemins dynamiques par nom d'utilisateur pour les URL de réunion uniques, comme indiqué ci-dessous:

'/'=>' réunion / identité ',

Cela a cassé de nombreux itinéraires à deux éléments tels que meeting / [meeting_id] jusqu'à ce que je passe au-dessus d'un mappage plus dynamique au-dessus de celui-ci pour qu'il soit prioritaire:    

'/'=>'/vue', '//'=>'/', 

Et tous les deuxièmes chemins d’élément contenant des caractères devaient être définis de manière statique, car nos chaînes d’identité pour les réunions étaient composées de huit caractères, par exemple.. fonctionnalités.

Itinéraires tels que fonctionnalités sont fixes, ce qui va au contrôleur des sites et action fonctionnalités Comme montré ci-dessus. Les fonctionnalités restantes sont mappées dynamiquement comme dans: '/'=>'/',

Essayer de créer une route de variable dynamique à un élément telle que / [nom d'utilisateur], par exemple. https://meetingplanner.io/berniesanders, a divisé de nombreuses routes à élément unique telles que https://meetingplanner.io/about et la page des rappels https://meetingplanner.io/reminder.

Je devais donc commencer à définir statiquement beaucoup d'entre eux. 

Voici le dernier routage avec de nouveaux itinéraires statiques pour les chemins d'un mot:

'urlManager' => ['class' => 'yii \ web \ UrlManager', 'enablePrettyUrl' => true, 'showScriptName' => false, // 'enableStrictParsing' => false, 'rules' => ['place '=>' place ',' place / yours '=>' place / yours ',' place / create '=>' place / create ',' place / create_geo '=>' place / create_geo ',' place / create_place_google '=>' place / create_place_google ',' place / view /'=>' place / view ',' place / update /'=>' place / update ',' place /'=>' place / slug ','/'=>'/vue', '//'=>'/',' daemon /'=>' démon /', // incl huit caractère action' site /'=>' site /', // incl huit action de caractère' features '=>' site / features ',' about '=>' site / about ',' wp-login | wp-admin '=>' site / neverland ','/'=>' réunion / identité ',' réunion '=>' réunion ',' ami '=>' ami ',' rappel '=>' rappel ',' utilisateur-contact '=>' utilisateur-contact ',' user-profile '=>' user-profile ',' user-setting '=>' user-setting ',''=>' meeting / scheduleme ', // note - les actions actuellement avec 8 lettres et aucun paramètre échoueront'/'=>'/',],],

Et vous pouvez consulter la "page de Bernie" et planifier une réunion avec lui ici:

https://simpleplanner.io/berniesanders

Remarque: Meeting Planner et Simple Planner fonctionnent de manière interchangeable et je gère les deux sites pour offrir aux utilisateurs plusieurs marques. Simple Planner est destiné aux rencontres sociales et Meeting Planner est destiné aux activités plus professionnelles..

Gestion de l'inscription et de la connexion à partir de la page Planifier avec moi

La plupart des personnes qui visitent initialement une page d'horaire avec moi n'auront pas de compte avec nous. Donc, ils seront redirigés quand ils cliquent Planifiez avec moi à la page d'inscription ou de connexion.

Une fois qu’ils se sont connectés, nous souhaitons les renvoyer à la page de création de la réunion pré-chargée avec le propriétaire de la page de planification avec moi ajoutée en tant que participant. Nous utilisons setReturnUrl pour faire ça:

Yii :: $ app-> user-> setReturnUrl (['meeting / create /', 'avec' => $ u-> nom d'utilisateur]);

Il met à jour la session (généralement via un cookie) de sorte qu'une fois inscrit ou connecté, une personne est renvoyée à la page cible..

Voici le /frontend/controllers/MeetingController.php complet actionScheduleme méthode:

fonction publique actionScheduleme () $ username = Yii :: $ app-> request-> getPathInfo (); $ u = Utilisateur :: find () -> où (['username' => $ username]) -> one (); if (is_null ($ u)) return $ this-> goHome ();  elseif (! Yii :: $ app-> user-> isGuest) if (Yii :: $ app-> user-> getId () == $ u-> id) Yii :: $ app-> getSession ( ) -> setFlash ('info', Yii :: t ('frontend', 'Bienvenue sur votre page de planification publique.'));  $ userprofile = \ frontend \ models \ UserProfile :: find () -> où (['user_id' => $ u-> id]) -> un (); Yii :: $ app-> user-> setReturnUrl (['meeting / create /', 'avec' => $ u-> nom d'utilisateur]); return $ this-> render ('scheduleme', ['user' => $ u, 'displayName' => MiscHelpers :: getDisplayName ($ u-> id, true), 'userprofile' => $ userprofile,]); 

Ajout du propriétaire de la page de calendrier en tant que participant

Voici le / frontend/controllers/MeetingController.php actionCréer méthode:

fonction publique actionCreate ($ with = ") … if ($ with <>") $ u = utilisateur :: find () -> où (['nomutilisateur' => $ avec]) -> un (); if (! is_null ($ u)) $ with_id = $ u-> id;  else Yii :: $ app-> getSession () -> setFlash ('erreur', Yii :: t ('frontend', 'désolé, nous n’avons pu localiser personne de ce nom. Consultez le support technique si vous avez besoin d’aide.' )); $ with_id = 0;  else $ with_id = 0;  // empêche la création de nombreuses réunions vides $ meeting_id = Meeting :: findEmptyMeeting (Yii :: $ app-> user-> getId (), $ with_id); if ($ meeting_id === false) // sinon, crée une nouvelle réunion $ model = new Meeting (); $ model-> owner_id = Yii :: $ app-> user-> getId (); $ model-> sequence_id = 0; $ model-> meeting_type = 0; $ model-> subject = Meeting :: DEFAULT_SUBJECT; $ model-> save (); $ model-> initializeMeetingSetting ($ model-> id, $ model-> owner_id); $ meeting_id = $ model-> id;  if ($ with_id! = 0) Participant :: add ($ meeting_id, $ with_id, Yii :: $ app-> user-> getId ());  $ this-> redirect (['view', 'id' => $ meeting_id]); 

Il traite l'ID utilisateur de la planification avec moi propriétaire de la page en tant que $ with_id pour les ajouter en tant que participant. Et il vérifie également d’abord qu’il n’ya pas encore de réunion entre ces deux personnes pour éviter les doublons:

fonction statique publique findEmptyMeeting ($ user_id, $ with_id = 0) // si vous rencontrez quelqu'un, voyez si elle existe déjà if ($ with_id! = 0) // recherchez une réunion avec un participant avec with_id $ meetings = Meeting :: find () -> where (['owner_id' => $ user_id, 'status' => réunion :: STATUS_PLANNING]) -> limit (7) -> orderBy (['id' => SORT_DESC]) -> tout ( ) foreach ($ réunions en tant que $ m) if (! is_null ($ m) && (nombre ($ m-> participants) == 1 && $ m-> participants [0] -> participant_id == $ avec_id)) return $ m-> id;  // // recherche une réunion vide dans les sept dernières $ $ meetings = Meeting :: find () -> où (['owner_id' => $ user_id, 'status' => Meeting :: STATUS_PLANNING]) -> limit (7 ) -> orderBy (['id' => SORT_DESC]) -> all (); foreach ($ meetings en tant que $ m) if (! is_null ($ m) et ($ m-> sujet == Réunion :: DEFAULT_SUBJECT || $ m-> sujet == ") et (compte ($ m-> participants) ) == 0 && count ($ m-> meetingPlaces) == 0 && count ($ m-> meetingTimes) == 0)) return $ m-> id; return false;

A l'origine, j'avais ajouté la fonctionnalité empêchant les utilisateurs de créer de nouvelles réunions alors qu'il y avait déjà une nouvelle réunion vide créée précédemment..

Regarder vers l'avant

Il y aura certaines choses à propos de cette page que je vais nettoyer à l'avenir, car je parle à de vrais utilisateurs et recueille leurs commentaires. Peut-être que je partagerai automatiquement les jours et les heures les plus fréquents des utilisateurs pour les réunions. Et je vais créer un paramètre utilisateur pour désactiver votre page de planification au cas où vous ne le voudriez pas.

En clôture

Tout le travail que j'ai effectué récemment avec Bootstrap pour créer une interface plus réactive pour Meeting Planner m'a permis de coder rapidement la page de planification avec moi..

S'assurer que les nouvelles routes Yii fonctionnaient et ne cassaient rien sur le site était la partie la plus difficile de cette tâche. Je suis aussi allé vérifier tous mes appels à l'Ajax pour m'assurer qu'aucun d'entre eux n'était touché..

J'espère que le tutoriel d'aujourd'hui vous a été utile pour apprendre à personnaliser les URL de site pour votre base d'utilisateurs et les bases du routage MVC..

Avez-vous vos propres pensées? Des idées? Retour d'information? Vous pouvez toujours me joindre directement sur Twitter @lookahead_io. Surveillez les prochains tutoriels ici, dans la série Construire votre démarrage avec PHP. Quelques fonctionnalités intéressantes sont en route.

Encore une fois, si vous n'avez pas encore essayé Meeting Planner ou Simple Planner, planifiez votre première réunion.. 

Liens connexes

  • Planificateur simple ou planificateur de réunion
  • Programmation avec Yii2
  • Comment programmer avec Yii2: Comportement Sluggable
  • Construire votre démarrage: améliorer le Web mobile