Category: dev

Thoughts on Progressive Web Apps

I was just watching some Google I/O 2016 videos and had some thoughts.

“Progressive Web Apps” seems to be a new buzz words, from my understanding it means, the latest/greatest web-apps leveraging new web platforms apis… for a better user experience.

Web-Apps that are more useful, more like Native Apps i guess.

One of the biggest api in “Progressive Web Apps”, is called “Service Workers“. Which supports Offline-mode (not to be confused with AppCache which Google says is unsecure and shouldn’t be used for new apps), and Push-Notifications.

 

Okay great, Pro-Web-Apps… service-workers nice… only problem is… Safari does not support service workers. It may never.

So that’s unfortunate.

To me the biggest benefit of creating web apps it that it can be run on any platform. Windows, OSX, Linux, Android, iOS all can use websites & web apps.

If Progressive Web Apps only works on Chrome, Android… but users of Safari/iPhone needs to download a separate browser… it kind of defeats the purpose of a universal app.

Programming for the web has always been about “lowest common denominator”. Making your webapp work on IE9 for example… (with the advent of evergreen browsers hopefully this will be a relic of the past.)

Why should I invest resources in making Progressive Web Apps that are only supported on Chrome? Wouldn’t I be better off just making a low-common-denominator web apps, and make a native iOS app?

I’m not sure but I guess Chrome wants to rule the world and be ubiquitous on every platform.

Edited (7-26-2016, 11pm):

I have to admit I wrote the above opinion before watching Taylor Savage’s nice talk about Polymer & Progress Web Apps.

Pretty impressive. I dig the progressive loading (only load the components necessary to view the current page, and pre-fetch the other components in the background or lazy-load them when needed).

So instead of loading the inter SPA with “load spinner” and all, you only load what you need. So this is better for the mobile web.

Idk, maybe I drank the kool-aid.

Platform of the Browser

An interesting Hacker News story made it’s round today, declare TypeScript Victorious.

Honestly I thought TypeScript was JS for Java developers.

However Angular 2.0 adopted it, which was interesting… I tought because Angular 2 was so different than Anagular 1.0, that it’ll die.

Learning Python currently and this reminds me of the Python 3, Python 2 shift… maybe they will co-exist…

Maybe technologies never win, lose or die… The TIOBE Programming Language Popularity index. If “Java” won… why is there still C, C++, C#, Python, PHP etc. developers?!?

Why isn’t all web-apps written in Java Spring Framework?

Why Do New Languages Start?

It’s to solve a problem that was a previous pain in old languages, tools & frameworks.

So this brings us back to the state of Front-End JavaScript Frameworks.

TypeScript dominance and Angular popularity made me re-accessed the current landscape.

What’s winning or has won, Angular, React, Ember?

So lot’s of people said React won… but yeah Angular still pretty popular… but can both React AND TypeScript win? I’m thinking TypeScript is synonymous with Angular 2.

Web Browser as a Platform

Just how there are many Programming Languages for Desktop/Server development, and there’s many frameworks on top of those languages, there are different “Languages” & Frameworks for client-side web applications.

Only difference is that instead of compiling to machine code or virtual machine code (Java, Python) these Client-Side Languages compiles to JavaScript.

JavaScript is the Browser equivalent of Assembly. Projects like ASM.js and Dart’s abandonment of browser integration in favor of JS compilation.

What’s wrong with JavaScript?

JavaScript is horrible. It was made in 48 hours. The actual “features” of the language is huge, but the actual features you should use is small.

What’s worse is that different web browsers translate the same code (Things like DOM manipulation) differently… Your webapp might work fine in Chrome and Firefox but semi-works in Safari and doesn’t work at all in IE. BUT your app needs to work on all of the above.

It’s a pain to get your app working in all these Web browsers…

That’s why Libraries and Frameworks for Client-Side JavaScript is so popular… it removes lots of crap we have to deal with.

So What JS Language and Framework Wins?

Different strokes for different folks.

Also since all these languages compiles to JS you can often use a combination. Ember with TypeScript, React with CoffeeScript, etc.

They will all co-exist I’d imagine like how Java co-exist with  C#, co-exist with C++, Python etc.

Maybe your use case is different, and you require different framework. You are a solo-developer who’s just coding a personal project for fun, vs a team of hundreds with strict product specs.

Don’t get pressured to code differently just because a stack seems more popular. If a language/framework is popular enough, go forth.

What is the first thing you need to understand as a new Web Developer?

I think the first thing you need to understand as a new Web Developer is that you can do it!

As in, it’s just code. And Code is just Text. And you can read. so you Can Code.

Basically, web development is mostly transparent. 98% of everything can be quickly de-mystified. You can go to any cool website you see, view the source, and figure out how they did it.

Or you can just Google how to do it, and there’s usually numerous free resources on how to do it.

But the idea I want you to get through to you is that, it’s not magic, it’s known and you can know it too.

Am I a Designer or Developer?

If you’re a front-end engineer, are you a designer or developer?

Some designers produce really good front-end code. (Html/Css)

Some developers product really good front-end code. (Html/Css/JavaScript)

Only the designers can design… The developers cannot design… (Visual Stunning Work)

Is this true?

So the question becomes, if you want to become a professional, what do you focus on?

Setting up RamNode VPS for Node.JS Development

Recently I had to get a VPS (virtual private server) for remote development.

Below are my steps:

Once I signed-up for RamNode, I chose their $3.50 a month, 512mb plan. Dirt cheap for web development.

I went with Ubuntu, seems like CentOS was the default.

SSH in, (I’m using Secure Shell for Chrome)

  1. Create a user.

since you don’t want to use root as your main account.

(replace username, with what you want your username to be)

useradd -m username (create home directory
adduser username sudo
passwd username
chsh username
(change default shell to /bin/bash)
sudo apt-get update
sudo apt-get install git
— add ssh key–
–add key to bitbucket–
then install your framework, currently in my case, Ember.

WTF is B-Tree?

You here it all the time, B-Tree this, B-Tree that… what da f*** is it?

It’s a way of storing data in an efficiently sorted way. In this video example of a b-treenumbers are being added to the tree in a sorted way. Larger numbers are on the right, smaller numbers on the left.

Basically, you have some sort of algorithm to decide where the new data goes in the tree. In this case, it’s simply “is the number bigger or smaller”.

Often, trees are “rebalanced”, like in this video, to keep the tree somewhat symmetrical, because it can make the tree more efficient.

Pretty good answer I found on reddit here.

Also on that thread, B-Tree are explained to be “A B-tree is a way of storing large amounts of data in such a way you can search for and retrieve it very quickly.”

And also apparently how they work is “pretty complicated”, so don’t feel bad if you don’t understand! I barely understood it until now!

TL;DR: B-Trees auto sorts & balance the data so they can be retrieved efficiently.