Webinaire ouvert «Création d'un site Web sur le framework Yii2»

Bonjour à tous!

La semaine dernière, notre nouveau professeur , Backend PHP Developer, a enseigné la première leçon ouverte sur «Créer un site Web en utilisant le framework Yii2». Nous portons à votre attention l'enregistrement et la transcription du webinaire lui-même.


Le framework de composant orienté objet Yii2 est un outil très populaire et utile qui est utile lors de la création de sites Web. La leçon ouverte d'Evgeny Volosatov, qui s'est tenue le 2 juillet 2018, a été consacrée à ce sujet. Dans le cadre d'une classe de maître interactive, l'enseignant a non seulement parlé de la même manière des caractéristiques du cadre, mais a également montré son application dans la pratique.

Le travail dans une leçon ouverte s'est déroulé selon le principe: "Il vaut mieux le faire une fois que de le voir cent fois". Toutes les étapes ont été réalisées séquentiellement et selon un plan préalablement préparé. Pour une meilleure compréhension du cadre, les modèles prêts à l'emploi n'ont pas été chargés. Toutes les modifications sont validées étape par étape. La rétroaction a été maintenue avec les élèves, de sorte que l'enseignant a immédiatement répondu aux questions et a aidé à faire face aux difficultés et aux erreurs.

Les outils suivants ont été utilisés dans la leçon en ligne:

• Serveur ouvert
• Environnement de développement PhpStorm
• Logiciel Git
• Un gestionnaire de niveau d'application de compositeur.

Tous les logiciels nécessaires ont été installés sur le PC avant le début des travaux.

Pendant la classe de maître, les étudiants ont été invités à effectuer un certain nombre de tâches pratiques avec l'enseignant:

1. Préparation du lieu de travail. La première étape consiste à lancer le panneau OS à partir du dossier Open Server et à le configurer (en sélectionnant une version spéciale d'Apache-PHP-7 dans l'onglet "Modules", en créant un domaine otus.localhost local dans l'onglet "Domaines"). De plus, le dossier otus a été créé à l'adresse OpenServer / Domains et le dossier Web y a été créé. C'est cette adresse qui est devenue le répertoire racine du futur site, tandis que le chemin d'accès (\ otus \ web) a été spécifié manuellement dans l'onglet "Domaines". Après avoir terminé les paramètres du serveur, le site a démarré avec succès et est devenu disponible dans le navigateur à otus.localhost.
2. Créez le premier fichier de projet. Cette procédure, comme de nombreuses autres, a été effectuée via la console Open Server. Il comprenait des commandes pour entrer dans le dossier otus (> cd otus), le dossier domaines (> domaines cd) et le dossier web. Le premier fichier index.php a été créé manuellement sur le Web et une ligne avec un contenu simple a été envoyée - Bienvenue.
3. Installation du noyau Yii2. La procédure a commencé par mettre à jour la version du gestionnaire de packages Composer via la commande> composer self-update et la préparer au travail en chargeant les bibliothèques et les modules. De plus, Git a été initialisé (> git init) et le fichier créé y a été connecté (> git add web \ index php). Ensuite, installez le noyau Yii2 via la commande> composer require "yiisoft / yii2: *". Par conséquent, les fichiers composer.json et composer.log sont apparus dans le dossier Web, plus le dossier du fournisseur (il a été ajouté aux exceptions Git). Après cela, il était nécessaire de télécharger PhpStorm et d'écrire certains paramètres de configuration et commandes dans index.php. En outre, un dossier séparé a été créé dans le dossier otus pour les paramètres de configuration, et il y avait un fichier web.php avec le contenu correspondant.
4. Créez un point d'entrée développeur pour gérer le programme. Le dossier Contrôleurs a été créé avec le fichier SiteController.php, les fonctions nécessaires et la classe avec l'héritage du contrôleur Web ont été enregistrées.
5. Création de représentations (Vues). À ce stade, un répertoire du même nom était requis, plus un dossier supplémentaire a été créé pour chaque contrôleur et il contenait un fichier index.php pour chaque méthode individuelle. La structure HTML a été écrite dans le fichier main.php, qui a été placé dans le dossier de présentations créé précédemment (cela a permis d'éviter une erreur).
6. Connectez et configurez les skins Bootstrap. Une étape difficile et importante, dont la mise en œuvre réussie a ouvert des opportunités pour le développement de beaux sites sans la participation d'un designer. Pour installer le module, une commande a été ajoutée à la ligne de commande du panneau pour connecter les composants, après quoi ils ont été téléchargés. Toujours dans le fichier main.php, il était nécessaire de créer un script php et de le connecter à Bootstrap. Ensuite, le composant NavBar, nécessaire pour que la navigation fonctionne, a été appelé. Des erreurs se sont produites et afin de les éviter, la configuration de Composer a été reconfigurée dans le fichier composer.json avec le chemin d'installation correct. Après cela, il est devenu possible de supprimer le dossier bower-asset dans le dossier du fournisseur. De plus, un travail a été effectué pour configurer le module de conception (des déclencheurs, un conteneur div, etc. ont été ajoutés au fichier main.php).
7. Créer une barre de menu et des éléments de navigation Rejoindre et se connecter. Les tâches ont été implémentées en insérant le code nécessaire dans main.php. Pour travailler avec la navigation de page dans le dossier du site, de nouveaux fichiers php avec des noms correspondant aux éléments de navigation (join.php, login.php) ont été créés. De plus, des modifications ont été apportées au contrôleur. Pour "nettoyer" dans la barre d'adresse, j'ai dû connecter le composant urlManager et définir les règles de redirection des requêtes du navigateur dans le fichier .htaccess créé à cet effet (dossier web).
8. Connexion de l'extension de débogage pour le système de débogage de projet Yii2. Pour que le système fonctionne, un logiciel spécial a été téléchargé et installé (lors de sa connexion, les étapes décrites dans les instructions sur le site Web du fabricant ont été exécutées). Après avoir réussi cette étape, l'utilisateur a pu voir les journaux, les demandes, la configuration et d'autres paramètres du site via un panneau d'interface spécial au bas de la page.

Comme toujours, nous attendons des questions, des suggestions, des commentaires ici ou regardez la deuxième leçon ouverte .