Ruby meme generator para atraer interés en el idioma

imagen

En mi opinión, el lenguaje Ruby dejó de ser tan popular como en 2012-2014, por lo que tuve el deseo, hasta que el idioma se olvidó por completo, de intentar llevarlo a las masas nuevamente, porque Ruby, en mi opinión, es el lenguaje más conveniente y práctico para el desarrollo web.
Hace aproximadamente una semana, estaba ansioso por hacer de mi comunidad telegramas, encontrar programadores principiantes y llevar el desarrollo de Ruby al lado positivo.

Los planes eran crear una comunidad, pero no en la que todos escribirían sobre sus problemas y errores en los proyectos (hay suficientes comunidades de este tipo), sino una comunidad en la que se publicará información útil del mundo Ruby.

En primer lugar, quería hacer publicaciones en forma de memes, pero con contenido educativo.

Como asi
imagen

Cuando hice 10 fotos a través del sitio de generadores de memes, me di cuenta de que todo es muy lento y problemático, además de todo, hice solo 10 métodos de rubí, y se pueden escribir alrededor de 1,000 más. Se decidió crear su propio generador de memes e incluso vincular la interfaz a todo esto y hacerlo todo utilizando el lenguaje Ruby.

Generación de imagen con RMagic


Para no molestarse mucho con el renderizado, se tomó como base la gema ya existente `rmagick` . Gracias a esta gema, podemos modificar fácilmente las imágenes.

En el siguiente código, creé nuevos objetos (textos) en forma de imagen y los coloqué en la imagen tomada como base.

Código lógico 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") 


Después de completar los atributos básicos como el tamaño de fuente, negrita, color y gravedad del texto. A continuación, guardo la imagen en la carpeta actual_mem. ¿Por qué necesito esta carpeta? Volveré más tarde.

Interfaz web en Sinatra


Ahora era necesario implementar la interfaz. Para no implementar un gran proyecto de Rails por una pequeña aplicación, decidí usar otro marco de Ruby llamado Sinatra

El resultado es un pequeño archivo con código para ejecutar la aplicación.

Archivo de lanzamiento de la aplicación 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 


Puede encontrar documentación sobre sinatra en el sitio web oficial, no explicaré mucho aquí.
Me atornillé un poco a CSS Grid y usando haml hice la página de entrada de datos para crear un meme

Código 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"} 


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


Mostrar en el navegador:
imagen

No agregué ninguna belleza en la primera etapa, solo necesitaba una implementación clara de lo funcional. Por lo tanto, la página solo tiene un título, dos etiquetas, entrada para el texto superior y área de texto para el inferior. Y también entrada para enviar el formulario al servidor.

Planes futuros


En el futuro, estoy pensando en completar el formulario: agregaré un control deslizante para establecer el tamaño de fuente del texto superior e inferior, controles deslizantes para colocar el texto, y también puede hacer un bloque de vista previa.

Además del generador de memes, también implementé un bot para el grupo, que, por comando, envía una imagen a la comunidad y mueve la imagen de la carpeta actual_mem a la carpeta sended_mem. El bot también está hecho en Ruby, pero si es interesante, haré un artículo al respecto en otra ocasión.

El artículo fue escrito para que los programadores novatos entiendan que el lenguaje no es complicado y que puede realizar sus ideas y proyectos lo más rápido posible y sin situaciones tensas en solo un par de horas.

Código fuente


enlace github

Elige rubí


imagen

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


All Articles