Building complex Javascript widgets from the ground-up

I am going to use the recently published CubicleSoft File Explorer widget as the basis of this post to show the process used to create a rather complex ~8,000 line Javascript widget from scratch with no external dependencies. It took approximately 2 months to go from concept/idea to complete widget implementation with full keyboard, mouse, and touch input support that works great on desktop, tablets, and even mobile devices! There are many things I learned along the way. So while things are still fresh in my mind, I'd like to jot down and share the process involved.The above is a live demo of the widget. Feel free to interact with it for a little bit, but don't get too distracted. There's an article to read!Alright, the best place to start when designing a widget of this magnitude is the actual design. I used to use tools like Photoshop, Adobe XD, and even paper and pencil to mock up user interfaces. While those have some value, when designing for the web, today'…
Recent posts