Meiner Meinung nach war die Ruby-Sprache nicht mehr so beliebt wie in den Jahren 2012 bis 2014, und so hatte ich den Wunsch, bis die Sprache völlig vergessen war, zu versuchen, sie wieder in die Massen zu bringen, da Ruby meiner Meinung nach die bequemste und praktischste Sprache für die Webentwicklung ist.
Vor einer Woche war ich versucht, meine Community in Telegrammen zu erstellen, Anfängerprogrammierer zu finden und die Ruby-Entwicklung auf die gute Seite zu bringen.
Es war geplant, eine Community zu schaffen, in der jedoch nicht jeder über seine Probleme und Fehler in Projekten schreibt (es gibt genügend solche Communities), sondern eine Community, in der nützliche Informationen aus der Ruby-Welt veröffentlicht werden.
Zunächst wollte ich Beiträge in Form von Memes verfassen, aber mit pädagogischen Inhalten.
Als ich 10 Bilder über die Website von Meme-Generatoren gemacht habe, habe ich festgestellt, dass alles sehr langsam und problematisch ist. Außerdem habe ich nur 10 Ruby-Methoden erstellt, von denen etwa 1.000 weitere eingegeben werden können. Es wurde beschlossen, einen eigenen Meme-Generator zu erstellen und sogar die Benutzeroberfläche mit all dem zu verknüpfen und alles in der Ruby-Sprache zu tun.
Bilderzeugung mit RMagic
Um sich nicht viel mit dem Rendern zu beschäftigen, wurde das bereits vorhandene Juwel
`rmagick` als Grundlage genommen. Dank dieses Edelsteins können wir Bilder leicht ändern.
Im folgenden Code habe ich neue Objekte (Texte) in Form eines Bildes erstellt und diese auf das als Grundlage genommene Bild gelegt.
Hauptlogikcode 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")
Nach dem Ausfüllen grundlegender Attribute wie Schriftgröße, Fettdruck, Farbe und Schwerkraft des Textes. Als nächstes speichere ich das Bild im Ordner actual_mem. Warum brauche ich diesen Ordner wird später wiederkommen.
Webinterface in Sinatra
Nun war es notwendig, die Schnittstelle zu implementieren. Um ein großes Rails-Projekt nicht für eine kleine Anwendung bereitzustellen, habe ich mich für ein anderes Ruby-Framework namens Sinatra entschieden
Das Ergebnis ist eine kleine Datei mit Code zum Ausführen der Anwendung
Datei zum Starten der Sinatra-Anwendung 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
Die Dokumentation zu Sinatra finden Sie auf der offiziellen Website. Ich werde hier nicht viel erklären.
Ich habe CSS Grid ein wenig verschraubt und mit haml die Dateneingabeseite erstellt, um ein Mem zu erstellen
Haml Code: !!! 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"}
CSS-Code: form { display: grid; grid-template-columns: 200px 1fr; grid-gap: 16px; } label { grid-column: 1 / 2; } input, button { grid-column: 2 / 3; }
Ich habe in der ersten Phase keine Schönheit hinzugefügt, ich brauchte nur eine klare Implementierung der Funktion. Daher hat die Seite nur einen Titel, zwei Beschriftungs-Tags, eine Eingabe für den oberen Text und einen Textbereich für den unteren. Und auch Eingaben zum Senden des Formulars an den Server.
Zukunftspläne
In Zukunft möchte ich das Formular ausfüllen. Ich füge einen Schieberegler hinzu, um die Schriftgröße des oberen und unteren Textes festzulegen, Schieberegler, um den Text zu positionieren, und Sie können auch einen Vorschaublock erstellen.
Zusätzlich zum Meme-Generator habe ich auch einen Bot für die Gruppe, der auf Befehl ein Bild an die Community sendet und das Bild aus dem Ordner actual_mem in den Ordner sended_mem verschiebt. Der Bot ist ebenfalls in Ruby erstellt, aber wenn es interessant ist, werde ich ein anderes Mal einen Artikel darüber schreiben.
Der Artikel wurde so geschrieben, dass unerfahrene Programmierer verstehen, dass die Sprache nicht kompliziert ist und Sie Ihre Ideen und Projekte so schnell wie möglich und ohne angespannte Situationen in nur wenigen Stunden verwirklichen können.
Quellcode
Github LinkWählen Sie Ruby