Générateur de mèmes Ruby pour attirer l'intérêt pour la langue

image

À mon avis, la langue Ruby a cessé d'être aussi populaire qu'en 2012-2014, et j'avais donc le désir, jusqu'à ce que la langue soit complètement oubliée, d'essayer de la transmettre à nouveau aux masses, car Ruby, à mon avis, est la langue la plus pratique et la plus pratique pour le développement Web.
Il y a environ une semaine, j'étais impatient de créer ma communauté dans les télégrammes, de trouver des programmeurs débutants et de mettre le développement Ruby du bon côté.

Les plans étaient de créer une communauté, mais pas dans laquelle tout le monde écrira sur leurs problèmes et bugs sur les projets (il y a suffisamment de telles communautés), mais une communauté dans laquelle des informations utiles du monde Ruby seront publiées.

Tout d'abord, je voulais faire des publications sous forme de mèmes, mais avec un contenu éducatif.

Comme ça
image

Quand j'ai fait 10 photos sur le site des générateurs de memes, j'ai réalisé que tout était très lent et problématique, en plus de tout, je n'ai fait que 10 méthodes rubis, et environ 1000 de plus peuvent être tapées. Il a été décidé de créer votre propre générateur de memes et même de lier l'interface à tout cela et de tout faire en utilisant le langage Ruby.

Génération d'images avec RMagic


Afin de ne pas trop se soucier du rendu, le joyau déjà existant `rmagick` été pris comme base. Grâce à ce bijou, nous pouvons facilement modifier les images.

Dans le code ci-dessous, j'ai créé de nouveaux objets (textes) sous forme de photo et les ai placés sur la photo prise comme base.

Code logique principal
 img = Magick::ImageList.new("1.jpg") title = Magick::Draw.new title.pointsize = 126 title.font_weight = Magick::BoldWeight title.fill = 'white' title.gravity = Magick::CenterGravity title.annotate(img, 0, 0, 0, -400, first_text) descritpion = Magick::Draw.new descritpion.pointsize = 72 descritpion.font_weight = Magick::BoldWeight descritpion.fill = 'white' descritpion.gravity = Magick::CenterGravity descritpion.annotate(img, 0, 0, 0, 300, second_text) img.write("actual_mem/#{first_text}.jpg") 


Après avoir rempli les attributs de base tels que la taille de la police, l'audace, la couleur et la gravité du texte. Ensuite, j'enregistre l'image dans le dossier actual_mem. Pourquoi ai-je besoin de ce dossier?

Interface Web dans Sinatra


Il fallait maintenant implémenter l'interface. Afin de ne pas déployer un grand projet Rails pour le bien d'une petite application, j'ai décidé d'utiliser un autre framework Ruby appelé Sinatra

Le résultat est un petit fichier avec du code pour exécuter l'application

Fichier de lancement d'application Sinatra
 require 'sinatra' get('/') do haml :index end post('/') do if params[:title] && params[:description] require 'rmagick' b = params[:description].scan(/[-a-zA-Z-0-9_.,()—-]+/) second_text = "" b.each_with_index do |text, index| if index.modulo(4) == 3 second_text += text + "\n" else second_text += text + " " end end img = Magick::ImageList.new("../1.jpg") title = Magick::Draw.new title.font = '' title.pointsize = 126 title.font_weight = Magick::BoldWeight title.fill = 'white' title.gravity = Magick::CenterGravity title.annotate(img, 0, 0, 0, -400, params[:title]) descritpion = Magick::Draw.new descritpion.font = '' if b.size > 20 descritpion.pointsize = 48 else descritpion.pointsize = 72 end descritpion.font_weight = Magick::BoldWeight descritpion.fill = 'white' descritpion.gravity = Magick::CenterGravity descritpion.annotate(img, 0, 0, 0, 300, second_text) img.write("../actual_mem/#{params[:title]}.jpg") end haml :index end 


Vous pouvez trouver de la documentation sur sinatra sur le site officiel, je n’expliquerai pas grand-chose ici.
J'ai un peu vissé la grille CSS et en utilisant du haml j'ai créé la page d'entrée de données pour créer un meme

Code Haml:
 !!! 5 %html(lang="en") %head %title C  %link{:rel => "stylesheet", :type => "text/css", :href => "/style/main.css"} %body %h1    %form{ :action => "/", method: "post"} %label   %input{ name: "title" } %label   %textarea{ name: "description" } %input{type: "submit"} 


Code CSS:
 form { display: grid; grid-template-columns: 200px 1fr; grid-gap: 16px; } label { grid-column: 1 / 2; } input, button { grid-column: 2 / 3; } 


Afficher dans le navigateur:
image

Je n'ai pas ajouté de beauté au premier stade, je n'avais besoin que d'une implémentation claire du fonctionnel. Par conséquent, la page n'a qu'un titre, deux balises d'étiquette, une entrée pour le texte supérieur et une zone de texte pour le texte inférieur. Et également une entrée pour soumettre le formulaire au serveur.

Plans futurs


À l'avenir, je pense à remplir le formulaire - je vais ajouter un curseur pour définir la taille de la police du texte supérieur et inférieur, des curseurs pour positionner le texte, et vous pouvez également créer un bloc d'aperçu.

En plus du générateur de meme, j'ai également un bot pour le groupe qui envoie une image à la communauté sur commande et déplace l'image du dossier actual_mem vers le dossier sended_mem. Le bot est également fabriqué en Ruby, mais si c'est intéressant, je ferai un article à ce sujet une autre fois.

L'article a été écrit pour que les programmeurs débutants comprennent que le langage n'est pas compliqué et que vous pouvez réaliser vos idées et projets le plus rapidement possible et sans aucune situation tendue en seulement quelques heures.

Code source


lien github

Choisissez Ruby


image

Source: https://habr.com/ru/post/fr468383/


All Articles