This blog post is brought to you by the developer of BitBudget. BitBudget is an automated budgeting app for Android and iOS which syncs with your bank account and helps you avoid overspending. If you’d like to quit living paycheck-to-paycheck and get a better handle on your finances, download it today! https://bitbudget.io
Quick update on my latest HTML5/Apache-Cordova application. I recently decided to ditch the Materialize CSS framework in favor of Ratchet, an HTML5 framework from one of the core contributors to Bootstrap. However, I’ve run into a bunch of problems using the Push.js library that comes with Ratchet. Push.js is kind of like Turbolinks in that it is meant to make building single page HTML5 applications a lot simpler than using something like React, Angular, or Vue. However push.js isn’t very well documented and I haven’t been able to get it to do what I want!
So… since I’ve already figured out how to get Turbolinks to do what I want, I’ve decided that I’m just going to dump the Push.js library that comes bundled with Ratchet in favor of Turbolinks instead. While I still don’t have everything worked out completely, I think Ratchet + Turbolinks is going to be the easiest way for me to build an HTML5 application using Apache Cordova. And hey, when I get all of this finished maybe I can just combine Ratchet and Turbolinks into my own nifty HTML5 framework? I really like Ratchet so far, it just seems to be missing some stuff when it comes to developing single page applications. To build my app the “push.js” way I believe would require me to do a lot of server-side rendering which isn’t really something I want to do.
I know that there are obviously the big three SPA frameworks out there that solve this problem, but they are a lot more complicated that what I want. I wonder if I can use Ratchet and Turbolinks plus a little of my own ingenuity to make the simplest single page application framework? I really want something that is almost as easy as just creating a website with straight HTML. I know it won’t end up being quite that simple, but I think I could whip up something like this, where when a user clicks on a button/link we =>
- Fetch some data from a server with AJAX (if necessary)
- Load new HTML that is stored locally on the phone with Turbolinks
- Add some JavaScript to each new HTML page that will dynamically update our HTML using the data returned from the server.