Créer un site web avec Sinatra

Table des matières
L'utilisation de Sintra comme un cadre est très large, il peut être utilisé pour créer des outils et des services qui utilisent HTTP En tant que couche de transport de données, cependant, ce n'est pas la seule chose que nous pouvons réaliser, il y a des moments où nous devons être capables de créer des pages Web où nous pouvons afficher des informations ou simplement capturer des données.
Cette création de pages web est très simple et complexe à la fois, car Sintra Il ne nous impose aucun type de modèle lors de leur construction, donc le niveau de complexité dépendra de la façon dont nous travaillons, ce qui peut être très positif si nous avons déjà notre propre façon de travailler.
1- Afin d'exécuter les exemples de ce tutoriel, nous aurons besoin d'une installation du langage Rubis au moins dans son version 1.9 À partir de.
2- Il faut aussi avoir installé la gemme Sintra et qu'il est correctement configuré. En cas de doute sur ce processus, nous pouvons consulter le tutoriel suivant.
3- Nous devons avoir des autorisations sur un dossier pour exécuter Rubis, créer et manipuler des fichiers.
4- Nous devons avoir un éditeur de texte pour pouvoir écrire le contenu des exemples, cela peut être n'importe quel type d'éditeur de texte brut qui nous permet de sauvegarder un fichier .rb comme Sublime Text ou encore NotePad++.
5- Enfin, nous avons besoin d'un navigateur Web comme Google Chrome ou alors Firefox où nous pouvons exécuter notre exemple et le parcourir.
Afin de créer un site Web en premier lieu, nous devons avoir une vision, un objectif, quelque chose qui nous guide et que nous pouvons utiliser comme référence lorsque nous développons, cela généralement nous réalisons lorsque nous savons ce que notre projet prendra.
Dans le cas du site internet que nous allons construire, l'objectif sera de créer trois pages, nous allons les lister :
  • Début
  • Sur moi
  • Contact
Cela nous amène au fait qu'il s'agira d'un site Web de référence ou d'un blog personnel, de cette manière nous devrons maîtriser certaines techniques que nous pourrons à l'avenir appliquer à d'autres projets. Afin que nous puissions voir nos progrès plus rapidement, nous allons itérer et corriger en cours de route pendant que nous construisons notre site Web.
Pour commencer, nous devons créer un fichier appelé start.rb, ce sera celui qui contiendra toute la logique des vues et des parcours de notre site web, le contenu initial qu'il possède est le suivant :
 nécessite 'sinatra' get '/' do erb: début fin
En principe, ce que nous venons d'écrire semble un peu insuffisant, mais voyons quelle est la fonctionnalité; en premier lieu, nous incluons Sintra avec instructions exigerCela signifie que nous pouvons désormais disposer de tous les outils que ce framework met à notre disposition.
On a alors le bloc avoir dans laquelle on définit que le contenu doit être exécuté dans le chemin racine, ledit contenu est un appelant erb à :début, où dans ce dernier il faut s'arrêter pour voir ce qui est CER et pourquoi nous l'utilisons, voyons :
Langage de modèle ERBComme le titre l'indique CER n'est rien de plus que l'acronyme de Rubis intégré o Embedded Ruby, cela nous permet de créer des modèles HTML où nous pouvons inclure du code écrit en langage Rubis et avec cela pour pouvoir incorporer sa puissance de traitement dans les vues. Nous les appelons par leur nom en utilisant des symboles, qui n'est rien de plus que le nom précédé de deux points comme nous l'avons vu dans le code :début.
Puisque nous sommes clairs sur le nouveau concept que nous introduisons, nous allons maintenant créer notre premier modèle, dans le même fichier start.rb que nous créons, nous allons incorporer le code suivant à la fin de celui-ci :
 __END__ @@ home Mon propre site web
  • Début
  • Sur moi
  • Contact

Bienvenue sur mon site, ici je vais démontrer ma connaissance de Ruby et Sinatra

Ici, nous avons plusieurs choses que nous pouvons analyser, d'abord nous commençons par dire Sintra que c'est la fin du traitement Rubis, pour cela nous utilisons __FINIR__ puis avec un double @@ Nous indiquons le nom de la section, dans ce cas début, si nous le regardons c'est le même nom de notre symbole.
Nous avons finalement écrit tous nos HTML sans aucun problème. Puis on passe à la console, on se positionne dans le dossier où l'on crée notre fichier start.rb et nous procédons comme suit :
 ruby start.rb
Nous pouvons construire le serveur de développement à partir de Sintra et nous verrons ce qui suit lorsque nous irons à hôte local : 4567 ou le numéro de port que nous avons relevé pour notre serveur :

Comme nous l'avons remarqué, nous avons le HTML que nous construisons dans le chemin racine que nous indiquons à notre application à partir de Sintra.
Une des choses que nous devons toujours éviter est de devoir répéter ce que nous ne pouvons faire qu'une seule fois et qui fonctionne pour plusieurs choses, dans le cas de notre page le HTML base est quelque chose que nous ne pouvons créer qu'une seule fois, si nous suivons l'exemple précédent pour construire les sections de Sur moi Oui Contact, nous aurions dû répéter tout le HTML en ne changeant que la partie contenu, quelque chose qui allait nous laisser un long, très long fichier start.rb.
Pour contrer ce type de comportement inefficace, Sintra nous permet d'utiliser la mise en page, avec cela nous pouvons créer une base où nous imprimerons simplement les modifications ou le code dynamique que nous allons générer.
Pour commencer à façonner notre mise en page, nous allons modifier notre fichier dans un premier temps start.rb et nous allons ajouter quelques routes supplémentaires :
 nécessite 'sinatra' get '/' do erb: start end get '/ on' do erb: on end get '/ contact' do erb: contact end
Maintenant, nous avons les itinéraires que nous mentionnons dans le menu HTML que nous avions construit avant, ce n'est que le début, déjà Sintra vous savez quoi rechercher lorsque nous appelons ces routes, la prochaine étape consiste à définir notre mise en page et le contenu qui sera affiché lorsque chaque route est appelée.
Pour ce faire, nous devons d'abord créer un modèle et l'identifier avec le nom @@ disposition, puis en utilisant Rubis Intégré avec les étiquettes, nous allons définir un titre unique et avec les étiquettes, nous imprimerons le contenu là où il est requis. À l'endroit où notre contenu change, nous placerons c'est un utilitaire qui nous permet d'indiquer à Sintra qui est dans cet espace où il doit imprimer le contenu de l'itinéraire.
Enfin nous définissons chacun de nos itinéraires et le contenu qu'ils transporteront, ceci suivant l'ordre logique @@route et puis le contenu, avec déjà Sintra sait quoi afficher à chaque appel. Voyons à quoi ressemble le code complet de notre fichier start.rb y compris la mise en page :
 nécessite 'sinatra' get '/' do erb: start end get '/ on' do erb: on end get '/ contact' do erb: contact end __END__ @@ layout
  • Début
  • Sur moi
  • Contact
@@début

Bienvenue sur mon site, ici je vais démontrer ma connaissance de Ruby et Sinatra

@@sur

Bonjour je suis le créateur de ce la toile, j'ai utilisé mes compétences pour faire fonctionner Ruby et Sinatra

@@contact

Si vous voulez en savoir plus sur moi, vous pouvez visiter Solvetic

Comme nous pouvons le voir, nous n'avons écrit qu'un HTML et le reste du contenu est plus résumé, donc beaucoup plus gérable et plus facile à maintenir, voyons à quoi cela ressemble dans notre navigateur lorsque nous naviguons vers un itinéraire différent depuis le début :

AGRANDIR

Nous avons déjà créé un site Web petit mais fonctionnel où nous avons plusieurs liens et nous avons un contenu dynamique, en utilisant uniquement une mise en page pour construire sa structure, bien sûr il nous manque encore les styles CSS et les images mais cela fait l'objet d'un autre tutoriel. Bien sûr, ce style n'est pas très utile si nous voulons avoir des connexions avec des bases de données, ou des fonctionnalités avec de nombreuses vues, car alors notre seul fichier commencerait à être très complexe à gérer et à maintenir.
Avec cela, nous avons terminé ce tutoriel, nous avons créé notre premier site Web en utilisant Rubis Oui Sintra, on profite du fait qu'on peut utiliser n'importe quelle méthodologie qui nous semble appropriée et qu'on a fait ce qu'on appelle une application monofile, ce type d'application est utile quand on a des projets très simples et qu'on ne veut pas qu'ils soient dispersés inutilement , comme le web résultant de l'exemple.Avez-vous aimé et aidé ce tutoriel ?Vous pouvez récompenser l'auteur en appuyant sur ce bouton pour lui donner un point positif

Vous contribuerez au développement du site, partager la page avec vos amis

wave wave wave wave wave