Blog Rubynetti

Improve UI interaction with Vue and Rails - the ui rich JSON layer.

I'm trying a new technique that born from the real situation of

Significatocanzone popularity is based on SEO reasons.

At the same time, I need to add rich UI interaction.

There is no famous js framework that gives you the ability to use them without changing the entire stack. 

Normally I use Vue. 

But the Vue main road has no support for existing backend written in a language different from js. 

Also in this stack, you need to change the backend if you need full SEO support and use Vue to the maximum power.

I'm working a lot with vue.js and I like it but I can't change the backend. I'm the only developer and rebuilt it from scratch is not affordable. Another big point is that I like a lot Ruby On Rails and his conventions.

So I'm trying to find a solution that gives me the possibility to use Vue together with Rails in a winning way.

I'm experimenting and seems a good idea to built a JSON layer over each page.

This idea is based to use rails normally.

The main content is rendered with rails.

The interactive part is built instead with a call to .json API from Vue after the first render.

Seems a very simple idea but there is no official guide about my situation so I'm trying to find new conventions to adapt to the new reality and the new js framework philosophy.

I think and I hope that js with rails can give me all I need.

Yes. I tried also Stimulus. But the granularity control that Vue gives me is another story.

In the next steps i want to add Vuex Orm to the recipe.

Chi siamo?

Rubynetti è una squadra di designer, sviluppatori e programmatori specializzata in applicazioni web. Il nostro focus è portare valore e automazione nei processi umani e aziendali attraverso l'uso delle tecnologie del web.

Operiamo da più di 20 anni nel settore e siamo specializzati su Vue.js, Nuxt, Rails e React.

Lavoriamo per lo più da Venezia centro storico.


Se hai bisogno di una mano per portare avanti o creare dal nulla un progetto digitale siamo a disposizione.