This is a basic but really useful (less is more) example of how to use Plotly to show a measure varying over time (live). You can resize the window here or on JSFiddle to check how it fits to the render area.
I created the exact same app in Vue and Vanilla. I called it Papafilms (yes, potatos and films…), you can search films, save your favorite ones and see details in a cool minimalistic and responsive interface. A small basic app to test Vue vs Vanilla code. Check it here from any device.
Both versions are exactly the same, only Vue is a little bit slower and with more boilerplate. I spent most of the time with CSS. In this case, for such a small app, it could be enaugh with just modern Vanilla. However, a really good point about Vue (or React) is that they make all developers to code in more or less a similar pattern.
I have used React and Vue before. They are very similar, it’s not that I don’t like them but they tie you to many dependencies, are verbose, heavyweight (not as much as Angular), slow (Virtual DOM) and their components are not compatible. Those frontend frameworks/libraries had a reason to exist in 2013, but with the web components and the current state of Browser Engines there is no real need for the current abuse of Angular, React and Vue in small apps.
To be honest with you I’m switching to a totally different approach, nowdays I’m using Svelte in small, medium and large apps (used by Facebook, Apple, etc).
Here you have some of the Svelte main advantages:
- Nice syntax and semantics
- Write less code
- Truly reactivity
- Transitions and animations
- Compilers enable output flexibility
- Great performance (vanilla, no virtual DOM, no need to load the framework in the browser, etc)
- Feels good
- Aligns with the web platform
Dear fellas, it looks like the lockdown is coming to an end, at least in some countries. To celebrate this (oh yes, coding), I would like to share an article where we explain how to recreate the Ubuntu Login using only CSS and semantic HTML. It is a cool exercise for those who are starting with CSS or wanna refresh some concepts. We will simulate a click event as well but remember that you can use your own OS login or even give your personal touch. Hope you like it ^^
First of all, we have to order our files using ls -v and concatenate them to a standar output with cat -n. From this ouput we read the sequence (n) and the name of each file (f). Finally, we rename the files using mv, adding a prefix and the sequence (n)
ls -v | cat -n | while read n f; do mv "$f" "prefix$n.jpg"; done
If we want to add a zero pad (p) to our sequence (n) we can do it easily with printf.
ls -v | cat -n | while read n f; do printf -v p %03d $n; mv "$f" "prefix$p.jpg"; done