Sunday, December 3rd, 2017
Tuesday, October 31st, 2017
A great bucketload of common sense from Jake:
Rather than copying bad examples from the history of native apps, where everything is delivered in one big lump, we should be doing a little with a little, then getting a little more and doing a little more, repeating until complete. Think about the things users are going to do when they first arrive, and deliver that. Especially consider those most-likely to arrive with empty caches.
And here’s a good way of thinking about that:
I’m a fan of progressive enhancement as it puts you in this mindset. Continually do as much as you can with what you’ve got.
All too often, saying “use the right tool for the job” is interpreted as “don’t use that tool!” but as Jake reminds us, the sign of a really good tool is its ability to adapt instead of demanding rigid usage:
Netflix uses React on the client and server, but they identified that the client-side portion wasn’t needed for the first interaction, so they leaned on what the browser can already do, and deferred client-side React. The story isn’t that they’re abandoning React, it’s that they’re able to defer it on the client until it’s was needed. React folks should be championing this as a feature.
Monday, September 25th, 2017
A good analysis, but my takeaway was that the article could equally be called Why it’s tricky to measure Client-side Rendering performance. In a nutshell, just looking at metrics can be misleading.
Pre-classified metrics are a good signal for measuring performance. At the end of the day though, they may not properly reflect your site’s performance story. Profile each possibility and give it the eye test.
And it’s always worth bearing this in mind:
Thursday, September 21st, 2017
Ooh, this is a tricky scenario. If you decide to redirect all URLs (from, say, a
www subdomain to no subdomain) and you have a service worker running, you’re going to have a bad time. But there’s a solution here to get the service worker to remove itself.
The server-side specifics are for NGINX but this is also doable with Apache.
Monday, September 11th, 2017
This blog post saved my ass—the Huffduffer server was b0rked and after much Duck-Duck-Going I found the answer here.
I’m filing this away for my future self because, as per Murphy’s Law, I’m pretty sure I’ll be needing this again at some point
Monday, August 7th, 2017
Paul goes into detail describing how he built a progressive web app that’s actually progressive (in the sense of “enhancement”). Most of the stuff about sharing code between server and client goes over my head, but I understood enough to get these points:
- the “app shell” model is not the only—or even the best—way of building a progressive web app, and
- always, always, always render from the server first.
Thursday, July 20th, 2017
It’s all very admirable, but it also feels a little bit 927.
Thursday, March 30th, 2017
Charlotte’s step-by-step account of setting up a Node server is going to be invaluable if and when I get around to dipping my toes in those waters.
Friday, February 3rd, 2017
Phil describes the process of implementing the holy grail of web architecture (which perhaps isn’t as difficult as everyone seems to think it is):
I have been experimenting with something that seemed obvious to me for a while. A web development model which gives a pre-rendered, ready-to-consume, straight-into-the-eyeballs web page at every URL of a site. One which, once loaded, then behaves like a client-side, single page app.
Now that’s resilient web design!
Sunday, January 15th, 2017
Scott runs through the latest improvements to the Filament Group website. There’s a lot about HTTP2, but also a dab of service workers (using a similar recipe to my site).
Saturday, December 10th, 2016
Certbot renewals with Apache
I wrote a while back about switching to HTTPS on Apache 2.4.7 on Ubuntu 14.04 on Digital Ocean. In that post, I pointed to an example .conf file.
I’ve been having a few issues with my certificate renewals with Certbot (the artist formerly known as Let’s Encrypt). If I did a dry-run for renewing my certificates…
/etc/certbot-auto renew --dry-run
… I kept getting this message:
Encountered vhost ambiguity but unable to ask for user guidance in non-interactive mode. Currently Certbot needs each vhost to be in its own conf file, and may need vhosts to be explicitly labelled with ServerName or ServerAlias directories. Falling back to default vhost *:443…
It turns out that Certbot doesn’t like HTTP and HTTPS configurations being lumped into one .conf file. Instead it expects to see all the port 80 stuff in a
domain.com.conf file, and the port 443 stuff in a
So I’ve taken that original .conf file and split it up into two.
First I SSH’d into my server and went to the Apache directory where all these .conf files live:
Then I copied the current (single) file to make the SSL version:
cp yourdomain.com.conf yourdomain.com-ssl.conf
Time to fire up one of those weird text editors to edit that newly-created file:
I deleted everything related to port 80—all the stuff between (and including) the
VirtualHost *:80 tags:
<VirtualHost *:80> ... </VirtualHost>
Hit ctrl and o, press enter in response to the prompt, and then hit ctrl and x.
Now I do the opposite for the original file:
Delete everything related to
<VirtualHost *:443> ... </VirtualHost>
Once again, I hit ctrl and o, press enter in response to the prompt, and then hit ctrl and x.
Now I need to tell Apache about the new .conf file:
I’m told that’s cool and all, but that I need to restart Apache for the changes to take effect:
service apache2 restart
Now when I test the certificate renewing process…
/etc/certbot-auto renew --dry-run
…everything goes according to plan.
Thursday, December 8th, 2016
Remy wants to be able to apply progressive enhancement to React: server-side and client-side rendering, sharing the same codebase. He succeeded, but…
In my opinion, an individual or a team starting out, or without the will, aren’t going to use progressive enhancement in their approach to applying server side rendering to a React app. I don’t believe this is by choice, I think it’s simply because React lends itself so strongly to client-side, that I can see how it’s easy to oversee how you could start on the server and progressive enhance upwards to a rich client side experience.
I’m hopeful that future iterations of React will make this a smoother option.
Saturday, August 6th, 2016
Sunday, May 29th, 2016
Switching to HTTPS on Apache 2.4.7 on Ubuntu 14.04 on Digital Ocean
I’ve been updating my book sites over to HTTPS:
First off, I’m using Let’s Encrypt. Except I’m not. It’s called Certbot now (I’m not entirely sure why).
I installed the Let’s Encertbot client with this incantation (which, like everything else here, will need root-level access so if none of these work, retry using
sudo in front of the commands):
wget https://dl.eff.org/certbot-auto chmod a+x certbot-auto
Seems like a good idea to put that
certbot-auto thingy into a directory like
mv certbot-auto /etc
Rather than have Certbot generate conf files for me, I’m just going to have it generate the certificates. Here’s how I’d generate a certificate for
/etc/certbot-auto --apache certonly -d yourdomain.com
The first time you do this, it’ll need to fetch a bunch of dependencies and it’ll ask you for an email address for future reference (should anything ever go screwy). For subsequent domains, the process will be much quicker.
The result of this will be a bunch of generated certificates that live here:
Now you’ll need to configure your Apache gubbins. Head on over to…
If you only have one domain on your server, you can just edit
default.ssl.conf. I prefer to have separate conf files for each domain.
Time to fire up an incomprehensible text editor.
There’s a great SSL Configuration Generator from Mozilla to help you figure out what to put in this file. Following the suggested configuration for my server (assuming I want maximum backward-compatibility), here’s what I put in.
Make sure you update the
/path/to/yourdomain.com part—you probably want a directory somewhere in
/var/www or wherever your website’s files are sitting.
To exit the infernal text editor, hit ctrl and o, press
enter in response to the prompt, and then hit ctrl and x.
yourdomain.com.conf didn’t previously exist, you’ll need to enable the configuration by running:
Time to restart Apache. Fingers crossed…
service apache2 restart
If that worked, you should be able to go to
https://yourdomain.com and see a lovely shiny padlock in the address bar.
Assuming that worked, everything is awesome! …for 90 days. After that, your certificates will expire and you’ll be left with a broken website.
Not to worry. You can update your certificates at any time. Test for yourself by doing a dry run:
/etc/certbot-auto renew --dry-run
You should see a message saying:
And then, after a while:
** DRY RUN: simulating 'certbot renew' close to cert expiry ** (The test certificates below have not been saved.) Congratulations, all renewals succeeded.
You could set yourself a calendar reminder to do the renewal (without the
--dry-run bit) every few months. Or you could tell your server’s computer to do it by using a
cron job. It’s not nearly as rude as it sounds.
You can fire up and edit your list of
cron tasks with this command:
This tells the machine to run the renewal task at quarter past six every evening and log any results:
15 18 * * * /etc/certbot-auto renew --quiet >> /var/log/certbot-renew.log
(Don’t worry: it won’t actually generate new certificates unless the current ones are getting close to expiration.) Leave the cronrab editor by doing the ctrl o, enter, ctrl x dance.
Hopefully, there’s nothing more for you to do. I say “hopefully” because I won’t know for sure myself for another 90 days, at which point I’ll find out whether anything’s on fire.
If you have other domains you want to secure, repeat the process by running:
/etc/certbot-auto --apache certonly -d yourotherdomain.com
And then creating/editing
I found these useful when I was going through this process:
- Certbot documentation
- How to secure your Apache using Certbot SSL
- Mozilla SSL Configuration Generator
- SSL Server Test
That last one is good if you like the warm glow of accomplishment that comes with getting a good grade:
You know, I probably should have said this at the start of this post, but I should clarify that any advice I’ve given here should be taken with a huge pinch of salt—I have little to no idea what I’m doing. I’m not responsible for any flame-bursting-into that may occur. It’s probably a good idea to back everything up before even starting to do this.
Yeah, I definitely should’ve mentioned that at the start.
Friday, April 15th, 2016
A step-by-step walkthrough of how GitHub has tweaked its Content Security Policy over time. There are some valuable insights here, and I’m really, really happy to see companies share this kind of information.
Tuesday, March 22nd, 2016
I’m so happy that Ember is moving to a server-side rendering model. Not only that, but as Tom points out here, it’s crucial that the server-side rendering is the default and the client-side functionality than becomes an enhancement.
Monday, March 7th, 2016
When I’ve been helping Codebar students on their personal projects, everything goes great until some kind of server-side processing is needed. Nine times out of ten, that server-side processing simply doing something with the contents of a contact form. This looks like it could be a useful service to plug into little projects like that.
Thursday, February 4th, 2016
This is useful if you’re making the switch to HTTPS: choose your web server software and version to generate a configuration file.
Tuesday, January 26th, 2016
Remember when I mentioned that you can get free certificates from Amazon now? Well, Oliver has written an in-depth step-by-step description of how he got his static site all set up with HTTPS.
More of this please! Share your experiences with moving to TLS—the more, the better.
Friday, January 22nd, 2016
If you’re hosting with Amazon, you now get HTTPS for free.