I made this Korean numbers converter:

Image for post
Image for post

Check it out here:

The task is originally from a coding challenge for a company in Seoul which I solved in my favorite language Ruby, and I thought it’s worth making a little app out of it. I really like Ruby, it’s fun to write and just makes sense looking at it. The less curly brackets the better, IMO. The less ceremony, the less confusion. So many people, coming from darker places like myself, rediscovered the joy of creating things with code trough Ruby, it definitely made the world a better place for programmers.

The app I made was done in Ruby on Rails, the front-end looks like a pretty standard reactive App, maybe even done in React or Vue you might think. So what’s the deal? Well…

Do you want to stay in wonderland?

What if I tell you that I didn’t had to write a single line of Javascript for this, no jumping trough transpiled frontend hoops either?

Image for post
Image for post

Let’s look at some code

app/views/converter/index.html.erb<input placeholder="type in Korean (일십삼) or plain numbers (105)" data-reflex="input->ConverterReflex#input" value= <%= @input %>> </input>Result: <%= @out %> 

This is all that is necessary for a reactive frontend. We need to tell a data-reflex attribute which Ruby class will handle which client-event. The event here is “input” (check html5 events for more like i.e. click), the Ruby class and accompanying method is “ConverterReflex#input”, that’s just like controller methods in rails!

Next is the other side, something what is called a reflex. I don’t want to go into the gory details of converting Korean numbers, so I went with a simple reverse of the input.

/app/reflexes/converter_reflex.rbclass ConverterReflex < ApplicationReflex
def input
@out = element[:value].reverse
end
end

The element variable here is the input field which triggered the reflex, we simply reverse the value and put it into a instance variable named @out, which is rendered in the view you saw previously.

That’s it!

Mind blown?

This is accomplished with a Ruby on Rails framework called Stimulus-Reflex:

Definitely check out the framework if this sounds remotely interesting and you want to stay in wonderland, for just a little longer.

If you’re interested in Korean numbers: peterlamber/koreanumbers

Thanks for reading

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store