Are you tired of React? Has it become too cumbersome and complicated to work with? Do you find yourself often rewriting code that was a best practice a few months ago but is now no longer recommended? Do you have framework fatigue? Learn the differences developing web applications between React and Rails. Change your mental model and go back to the basics.
Designing a simple user interface can oftentimes be more difficult than expected. They are deceptive. A frictionless interface is no stroke of luck; a lot of work and experience go into making something you can use without thinking about it.
The separation of concerns is a longstanding, tried-and-true design principle in software development. When it comes to the web, the classic separation of concerns is HTML, CSS, and JS. But this has become a tiring, cumbersome, and fragile system to work with. I argue that the traditional separation of concerns on the web has died and been reborn with a new vision for what a "concern" even is.
There are quite a lot of native HTML elements we can use to enhance our components to give them the most support and features "out of the box." In this article we are going to dive into the native HTML disclosure elements to build an accordion component, learn how to use and extend it, all with vanilla JS and optionally some other popular JS frameworks.