When it comes to poking through examples of slick features online, it's easy to get sucked into what 'could be.' During my most recent project, a Ruby on Rails API with a Javascript front end I decided to try to spice it up a little.
Front end work is admittedly less familiar than handling logic and backend organization, so I decided this would be my time to shine. After selecting a couple features I wanted to integrate into my application, I quickly got to work.
And stopped shortly after. The styling and amount of event listeners for very nuanced features was overwhelming. Piece by piece I removed the components that made it look so attractive, until I was left with the basic HTML elements, and a learned lesson.
I gained the bulk of the functionality I was aiming for, but at a significant cost. The final implementations took about 10% of the total time invested, the other 90% was unwinding complex styling and going down rabbit holes. I can say for sure, I will still be scouring the web to gather ideas of an ideal product but my approach will be completely opposite.
Pairing these examples down, especially ones you can identify as being outside of your understanding, to their base elements and starting there allows for early victory. Additionally, there is no point to having a pretty thing that doesn't work, so focusing on the nuts and bolts of the elements, prior to getting distracted with how they look will ultimately be a better user experience than something that is buggy or not functioning at all.
Lesson learned: aim high, but find the core components of each example and be strategic about the integration process. Most importantly, if you don't understand the basics of the example, set it aside for a time when you can properly research the implementation.
Top comments (0)