6/29/2020 - 5 year coat of paint
It has been quite awhile since I last touched this website. Looking back I can see using Bootstrap, Knockout, and jQuery as an interesting design choice to solve theming/styles, data modeling, and requests/DOM manipulation without needing to dive to deep into how it works. I wanted to approach this new coat of paint with a minimal look and feel. Choose a few colors (black, white, orange) and supply web-font to ensure uniform look at feel. With time passing I have had a chance to work on professional projects where we need to solve similar problems and have taken two routes for development:
- Take some tools
- Build your own
Take some tools
It will always be easy to take the wheel or secret of fire and make something that works reasonably well. Reasonably well also ends up on client projects and some later team will need to evaluate those past decisions. I am not advocating writing my own library to talk to Twilio services because I feel there is some grave mistake in the available library. I am suggesting to think about why we are using these tools and if we need them. Depending on project requirements or time limitations the best option is to look at what is available and have a narrow list of choices. From these choices determine what later problems might need addressing through issue submission or fxes or if there is value in writing your own solution.
Build your own
When the wheel does not exist you are either pushing that object yourself or thinking about how you would make it move. Sometimes our needs fall outside what is outside public knowledge and we must cobble something together. I may need to authentication to Salesforce and request a subset of data from a few resources and do some further processing. I can venture a guess that my requirements might be partially satisfied, but not fully. Building your own solution also means taking on responsibility for keeping it useful over the required lifetime.
Here we are
So taking a little of from both I ended up using:
The bane of my existence has and will continue to be CSS. It looks good on my laptop and not so on my phone. Can I move this item 1px to the right or get it correctly layed out on the screen. I decided to make use of CSS resets or normalizing layout to start with to try and make things easier on myself. I broke down the remaining CSS into:
- shared - styles shared across both JS and noscript
- noscript - when user disables JS
- style - when user enables JS
Neat noscript tricks
I am still not sure I touched the full breadth of Webpack, but at least had a chance to install a few plugins, define a few rules and convince it to spit out a website. Not sure if this coat of paint will stick for another 5 years, but who knows.