19 Billion Reasons Why Your Startup Should Bet on Hybrid Application Development with HTML5, CSS, & JavaScript

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

For my latest startup endeavor, MoneyPhone, I decided to develop and launch the product using web technologies. The main reason for this was that I’m 1) simply better at programming using HTML, CSS, & JavaScript, and 2) I really wanted to use something cross platform if possible. It’s just really awful to be an Android guy, create an app, and then everyone you show it to has an iPhone. And creating an iPhone app when you’re really an Android guy is kind of a bummer as well. So naturally, I just decided to go with web technologies given that my particular project did not require that I tap into any lower level system type stuff that might require native code.

However, I ran into some serious problems recently trying to market MoneyPhone. Launched as a web application at the URL https://moneyphone.app, people didn’t really seem to understand what a web app is. Is it a website? Or is it an app? People just didn’t seem to care or understand. However, this upcoming week I plan on solving this problem by packaging the app up as a hybrid application using Adobe PhoneGap (or Apache Cordova) and publishing it on the Google Play Store, and the App Store at some point as well.

But all of this web-dev stuff has left me with a little imposter syndrome as of late. So is this thing really an app? Or am I just some poser bundling his ‘website’ up with a wrapper, putting it on the App Store, and calling himself a developer? Possibly.

Although that’s not really the point of this post however. The point of this post is to make myself feel better about my choice of technologies by making note of the fact that Slack, a company built on HTML5, CSS, JavaScript, and now the Electron Hybrid Application Framework, recently went public on the New York Stock Exchange at a market capitalization of $19,500,000,000. Badda bing! Badda boom!

UPDATE (6/23/2019): Since I don’t actually use Slack, I’m not sure how popular the electron version of Slack is. Maybe what really took off was their web app, and they just also happened to release an electron based version for Desktop as well. But never let the truth get in the way of a good story 😉

 

Why you should use TurboLinks instead of Intercooler.js or… How to Use TurboLinks without Ruby on Rails

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

Interesting title eh? Just had a few thoughts on TurboLinks vs. Intercooler.js that I wanted to jot down here on the blog in case anyone else out there on the internet needs help making some similar choices as the ones I’ve been mulling over the past couple weeks…

So you want to build a single page application the simple way using something like TurboLinks or Intercooler.js, right? If you’re using Ruby on Rails the choice is simple, just use TurboLinks. However, if you’re like me and you aren’t using Rails and are using something else like Python & Flask the answer is a little trickier. I mean, can you even use TurboLinks if you aren’t using Rails? Well yes! Yes you can use TurboLinks without rails. In fact, it’s quite simple. All you need to do is drop a little <script> tag in your <head> pointing to a CDN hosting the transpiled/compiled version of TurboLinks and you are well on your way!

  <script src="https://cdnjs.cloudflare.com/ajax/libs/turbolinks/5.2.0/turbolinks.js"> 

To learn more about actually using TurboLinks, make sure to checkout TurboLink’s Official README on Github, and also take a look at my very basic TurboLinks demo as well.

Okay, so on to the last point– Why you should use TurboLinks over Intercooler.js. When I was first taking a look into both of these options I actually selected Intercooler.js over TurboLinks as I thought that Intercooler.js was less tied to Rails and was more of a general purpose tool compatible with whatever language/framework you happen to be using. However, I soon ran into a huge problem. After adding Intercooler.js into my project all of the JavaScript I had written on my secondary pages broke! This was pretty demoralizing and I almost gave up on the idea of using a JS library to transform my web app in to a single page application, however I decided to give TurboLinks a second look. And to my delight, I quickly found that TurboLinks handles loading JavaScript from secondary pages with ease right out of the box by default! Had I gone with TurboLinks initially instead of playing around with Intercooler.js first, my webapp would probably already be a single page application.

So in conclusion, TurboLinks is the bomb.com and you need it in your life!

 

inc-you-beta.xyz

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

After a disastrous day of guerrilla marketing with my good buddy Sameer Khan attempting to promote my latest startup venture MoneyPhone, I decided to register a new $1.17 domain name for a new idea that we both sort of riffed on at the very end of our adventure today: inc-you-beta.xyz

So here’s the idea– a zero equity startup accelerator where the sole purpose is to connect founders with other founders willing to beta test each others apps. One problem I’ve run into many times and complained about here on the blog at least once is that when you create an app, no one really cares. However, other startup founders and makers probably do care. So why not try and connect the people that actually care so they can scratch each other’s backs?

Coming soon… Summer 2019, Launching on Pioneer.app & AngelList

 

Intercooler.js Bug: Body Overflow Hidden Toggled on New Page Load

Ran into a little bug here tonight playing around with Intercooler.js. At the moment I’m converting my traditional web-app, MoneyPhone, into a single page application using Intercooler.js. However, whenever I attempt to swap out one page with another using Intercooler.js, somehow all of the page overflow is becoming hidden. I’ve poured over my code and can’t find anything related to ‘body overflow hidden’, but did see in the developer console that the style property overflow is indeed being set to hidden whenever a new page is loaded in the background with Intercooler.js.

So I just wanted to post a quick little bug fix here on the blog in case anyone else out there on the ole interwebs runs into this problem in the future:

$(document).on('success.ic', function(event, ajaxSetup, elt){
  document.getElementById("body").style.overflow = 'visible';
});

 

How to Play Music in Python without Blocking the Main Thread

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

One of my students today at theCoderSchool was interested in writing a Python program that featured music. However, we quickly ran into a problem of blocking the main thread. But thanks to the threading library, we were easily able to play the music on it’s own thread and get back to coding her program:


from playsound import playsound
from threading import Thread

def play_music():
    playsound('wooboost.mp3')

# Play Music on Separate Thread (in background)
music_thread = Thread(target=play_music)
music_thread.start()

print("Does playsound block the main thread?")
user_input = input("What is your guess?: ")
print("You guessed: " + user_input)

 

How to Pitch Like Melanie Perkins

Read a really interesting article on Forbes today about Melanie Perkins, CEO of Canva, on how she went about pitching Canva to Venture Capitalists in the early days. Perkin’s says that when she first started pitching Canva, she always started with her solution to the problem she was trying to solve. However, when she switched up her pitch and started leading with the problem instead, she finally found success raising money for Canva.

I don’t think leading with the problem is necessarily intuitive, so I wanted to make a quick note of Perkins insight here on my blog so that I’ll remember to always lead with the problem when pitching MoneyPhone. I’m planning on re-shooting a video about MoneyPhone for my landing page explaining the product this month, and I think I now have a much better idea on how to go about presenting MoneyPhone to potential users. But this time, I’m going to make sure to lead with the problem before presenting my solution:

  • Habit– You eye-ball your bank account balance and have no idea how much exactly you are spending every month and where all of your money is going.
  • Problem– You end up living paycheck-to-paycheck. Make more money and you spend more money. Make less money and you spend less money.
  • Solution– You need MoneyPhone in your life!
 

Synapse: Programmable Banking Platform

Just wanted to write a quick post about a new startup I discovered today called Synapse. Synapse is a programmable banking platform that “enable[s] companies to build and launch best-in-class financial products. ” At the moment I happen to be working on a new personal finance app called, MoneyPhone, and I think it would be really interesting to see what sorts of features I might be able to add using Synapse. Specifically, I think it would be really awesome if I could create a checking account that gives users control to prevent companies from pulling money from your account at will. Here’s an example: I signed up for some sort of dental plan through my dentist last year under the assumption that I was making one payment for one year of this dental treatment plan. Well 12 months later the dental plan company just pull $300+ dollars from my account unannounced. Month-to-month payments aren’t that bad, but companies shouldn’t just be able to pull money from your account unexpectedly. So I’m going to have to check out Synapse and what all I can do with it. I am very excited about the new features I might be able to add to MoneyPhone in the future with the power of Synapse.

 

Stripping Special Characters from Strings in JavaScript without Regex

Last night while working on my latest project, a personal finance application, I ran across the need to strip certain (special) characters from a string of user input in JavaScript. I assumed that there was an easy built in feature to do this in JavaScript, but most of the examples I found either used Regex which I don’t really want to use, or utilized some other confusing method that was not particularly straight forward. So, I decided to go ahead and post my ugly yet simple solution here on the blog in case anyone else might one day need it.

For my technique, I simply have one string variable that I want to strip special characters from, and another empty string which I will append characters from the original string excluding any special characters that I want to ‘strip’: SOURCE CODE ON GITHUB