Captain Codeman

Web Development and Cloud Computing

AppEngine Applications - Doing the Math

How much does it cost to run a cloud app on AppEngine?

So for various reasons I decided to write my own blog engine and because I think AppEngine is such a fantastic platform (especially for hosting multi-tenanted apps) that is what the initial runtime implementation uses.

I now have a few blogs setup which demonstrate the multi-tenancy working so I thought it was a good point to do some back-of-the-envelope math to figure out how much it would cost to host or how many blogs I could host for any given price.

Remember - one of my motivations for doing this is that I’m too cheap to pay for someone else to host my blog and I also want to host blogs for friends and family without ending up on the endless treadmill of maintaining servers, database backups and WordPress plugins.

So how’s it looking so far?

appengine paas blogserve

Read more ...

AppEngine, PaaS, Still Ahead of it's Time

Don't ignore it because it's old

I’m an avid user of AppEngine and just discovered that it turns 9 years old this week.

9 years! That’s almost as close to infinity in Internet Time as you can get without tearing a hole in the fabric of the universe.

The amazing thing is that despite its age it’s still way ahead of it’s time in many ways and I think that is why it doesn’t get as much attention and fanfare as it really deserves. I remember the first time I came across it I didn’t really “get” what it would do for me so it was a couple of more years before I switched to it.

So in case you don’t know, here are some reminders of why it’s so brilliant …

appengine paas

Read more ...

Google Analytics for Polymer Single Page Apps

How to track page views with a Polymer SPA

Just a quick snippet for integrating Google Analytics with Polymer Single Page Apps.

As well as tracking ‘page’ views anytime the route changes, it also uses Google Analytic’s Exception Tracking feature for cheap-as-chips error reporting - handy to check on any browser compatibility issues you might have missed.

polymer spa

Read more ...

Polymer 2 - the 10Kb Web Framework

The age of the dinosaur monster web frameworks is ending

I saw this data from a Polymer product manager buried in a GitHub issue comment and thought it was worth highlighting to show just how amazing Polymer 2.0 is when it comes to framework-size. Many JS frameworks have made grand promises about the small size of their apps but it’s usually only after an inordinate amount of work and effort that you even get close to the promised values, if at all (my Angular 2 app was never anything buy huge).

Polymer is very different to many of the JS-first frameworks in that it builds on the web platform instead of trying to reproduce and replace so much it - because browsers are actually very good at parsing HTML and rendering it quickly if only you let them get on with it (yeah, who knew!).

So instead of trying to offer as many features as possible (does anyone really need “dependency injection” for a JavaScript web app?) it instead tries to add as little as possible, deferring to the functionality already built into the platform whenever possible. The result is a light sprinkling of features on top of what the browser does and does fast, adding data-binding, dealing with cross-browser compatibility when needed etc… and more recently, handling compatibility between v1 and v2 of Polymer and v0 and v1 of web-components.

Here are the individual + combined sized of the different Polymer versions together with the Polyfills required in each browser …

polymer web-components web-frameworks javascript

Read more ...

Polymer 2.0 Build with HTTP/2 Server-Push

High performance without javascript bundling

One of the really great things about Polymer 2 beyond the framework itself is the well thought-out tooling with the polymer-cli helping you with project templates, local dev-serving, testing, linting, build and packaging.

The only thing it doesn’t do for me right out of the box is create the information needed to add http/2 server-push. It will actually generate link prefetch tags that go into the index.html page which does speed things up but what I really wanted was to push the dependencies for a view on first load with the first request.

It turned out not to be too difficult at all …


Read more ...

Polymer 2.0 - Simple and Elegant

Web client frameworks don't have to be complicated

If you’ve been involved in front-end web development for the past few years you will no doubt have come across the concept of “JavaScript Fatigue”.

It’s the result of constant and seemingly endless changes, reinventions and releases of tooling and frameworks that you feel you need to keep up with.

Often it seems like something is invented so solve one problem but brings with it more issues. And in the world of JavaScript there’s nothing that can’t be fixed by new tooling … always, oh so many tools.

But things are going to change …

polymer web-components

Read more ...

New BlogServe Blog Engine

Why I decided to write my own

Because everyone should write a blog engine at some point in their life …

This is the story of how I went from WordPress, to Jekyll, to Hugo, thought about going back to WordPress, briefly considered Ghost but ultimately decided to write my own multi-tenanted blog engine instead, powered by Google Cloud, Go and Polymer.


Find out more ...

Angular2 DI Service Decorator

How Dependency Injection is meant to work

Dependency Injection or ‘DI’ is a mechanism used within Angular2 to provide instantiated services or other objects to the components (and other services) that need them. It allows a class to ask for just what it needs without needing to know about the entire tree of dependencies in order to create them itself.

The idea of DI is based on design principles intended to help us write better, cleaner and easier to maintain software. Unfortunately, there are certain limitations in the implementation of the Angular2 DI system which mean it’s not always obvious how to get all the benefits we should.

So, we’ll explore these principles using DI with the Http and an AuthHttp implementation as an example to show how it is still possible to achieve.

angular dependency-injection

Read more ...

Angular2 New Component Router Review

My experience of using it

What makes a good client-side router? What do we even want a router to do? What is Angular2’s Component Router like and should you plan on using it?

I’ll share my own thoughts on this based on my experience of using it so far.

First thought, we need to understand why we use a javascript router in the first place. Some of this may seem “duh” basic but it’s often worth taking a step back in order to evaluate exactly where we are.

angular routing

Read more ...

Angular2 Route Security

Restricting access based on auth state or roles

Once you move beyond the quick-starts and examples and start building a real app with Angular2 you soon find you need to handle things that the examples often leave out or pass over.

Securing routes with the new component router is one of these and it can be difficult to figure out. Here’s the approach I’m using which seems to be working well for me and has been reusable across multiple projects.

angular routing auth

Read more ...