← Articoli

App dimostrativa di Ruby nel frontend

Demo di Glimmer DSL for Web come sito statico

Sono entusiasta di presentarvi una nuova e innovativa libreria Ruby, Glimmer DSL for Web 0.2.3 (beta), sviluppata dal mio amico Andy Maleh!
Glimmer DSL for Web è una libreria frontend per interfacce web con Ruby nel browser, che rivoluziona lo sviluppo web permettendo di eseguire codice Ruby nel browser per le applicazioni frontend. Ciò è in linea con la visione che Matz ha condiviso nel suo keynote alla RubyConf 2022: sostituire JavaScript con Ruby nello sviluppo frontend.

‍
Ciò che distingue Glimmer è la sua semplicità e produttività, in linea con la filosofia di Ruby.
Supporta il data binding unidirezionale e bidirezionale, il rendering HTML dinamico e una progettazione modulare con i Glimmer Web Components. Finalmente potete godervi Ruby puro sia nel frontend sia nel backend!

️
Ho creato un’applicazione dimostrativa per mostrare come iniziare con Glimmer DSL for Web senza bisogno di Rails né di alcuna configurazione. Potete darle un’occhiata qui: Largo/glimmer-dsl-web-standalone-demo

Guardate in particolare script.js.rb, il codice dell’app che verrà eseguito nel frontend.


include Glimmer

class State
 attr_accessor :name
 attr_accessor :welcome_text

 def name=(value)
    @name = value
    update_welcome_text
    puts "update name"
  end

  private

  def update_welcome_text
    self.welcome_text = "Welcome! #{@name}"
  end
end

@state = State.new

Document.ready? do
    div {
        label('Name: ', for: 'name-field')
        @name_input = input(type: 'text', id: 'name-field', required: true, autofocus: true) {
            value <=> [@state, :name]
        }
    }
    div {
        inner_text <= [@state, :welcome_text]
    }
    button('Greet') {
        onclick do
          $$.alert("Hello, #{@state.name}!")
        end
    }
end