So, I previously blogged about how we hosted CraftCMS on Heroku. When we built the marketing site for Quala the twig templates were built for maximum authoring flexibility at the cost of some TTFB problems. We knew this going into the project. In an ideal world we would use GatsbyJS to build the frontend, but we very limited in time. When we went live, we saw a dramatic improvement to First Contentful paint, but a huge decrease to Time To First Byte, averaging at 1.3 seconds.
Dynamically changing the site-theme meta tag
So, incase you are unfamiliar, there is a meta tag called <meta name="theme-color" content="...">
that is used to change the color of the navbar on desktop safari, mobile safari, and mobile chrome. If you don't set a value these browsers tend to find a color that match the site to the best of their ability. However, sometimes even setting the value can cause the site to look ugly.
Serving AMP Pages with Dotnet Core
I remember when (Accelerated Mobile Pages) first came out, and it was very restrictive and weird. I think this ultimately hurt the AMP Brand Beyond this, several companies have built AMP experiences which haven't always been the best experience. I do however think AMP pages always load extremely fast. A lot of that is just the constraints of AMP. Last night I put my blog posts on AMP for a laugh, and it was much easier than I thought it would be.
About
I am a software engineer. I currently work at Quala. I have worked on all area's of the stack. From a sysadmin, network engineer, backend developer, and frontend developer. I've helped build some extremely large scale websites such as Vistaprint and CarGurus. I have a passion for high performing software, devops, and front end. I am a huge fan of JavaScript, C#, Golang, and Rust.
I blog about my general pains building software.
Why Terrible Dev?
Honestly, I was a network engineer, and I worked with many developers. They'd often blame bugs on the network, or the database. I heard a lot of it works on my machine. I started the TerribleDev twitter handle where I posted some things developers said. Then when I became a developer, I figured I'd just make it my handle. These days, I'm now blaming the network 🤣.
Accessibility Driven Development
I've been working at CarGurus.com for the last 2 years or so. One of the biggest journeys we've been undertaking is to take accessibility far more seriously. However with an engineering team way into the triple digits it gets harder and harder to scale accessibility knowledge.
5 web perf tips for 2019
As more and more of the world is getting online, a larger part of the internet community is using the internet on lower powered devices. Making websites fast is becoming paramount. Here are 5 tips to improving you web page's performance
Must have vscode plugins for front-end devs
I've had a lot of people ask me about my choice of editors, and plugins. A while back I switched to vscode for all my programming work, for both front and back end. In the past I've blogged about the best plugins for visual studio as a backend dev, but I thought I'd give you a more front-end angle
Compressing images with tinypng's CLI
Ok so I'm really lazy, and I honestly think that has helped me a lot in this industry. I always try to work smarter, not harder. I take many screen shots for this blog, and I need to optimize them. Incase you didn't know many images are often larger than they need to be slowing the download time. However, I don't ever want to load them into photoshop. Too much time and effort!
Rebuilding this blog for performance
So many people know me as a very performance focused engineer, and as someone that cares about perf I've always been a bit embarrassed about this blog. In actual fact this blog as it sits now is fast by most people's standards. I got a new job in July, and well I work with an absolute mad lad that is making me feel pretty embarrassed with his 900ms page load times. So I've decided to build my own blog engine, and compete against him.
Measuring, Visualizing and Debugging your React Redux Reselect performance bottlenecks
In the battle of performance one tool constantly rains supreme, the all powerful profiler! In javascript land chrome has a pretty awesome profiler, but every-time I looked into our react perf issues I was always hit by a slow function called anonymous function
Deploying a react app to azure blob storage websites with azure devops
Back in August of this year Microsoft announced static websites for azure blob storage. So this is the same feature AWS' S3 has had for years. Essentially make a blob storage folder public, and redirect /
paths to /index.html
internally. Also, register 404 pages. Before we had this we use to deploy our files to App Service
or do some weirdness with functions to rewrite urls. For static pages this can really bring costs down in the cloud
The battle of the bulge. Visualizing your javascript bundle
So incase you havn't been following me. I joined Cargurus in July. At cargurus we're currently working on our mobile web experience written in react, redux and reselect. As our implementation grew so did our time to first paint.
Creating a slack slash command with 0 code using Azure Logic Apps
Ok so recently I was chatting on a slack, mostly sharing cat pictures, when I realized the CarGurus slack account did not have a /cat
command. I knew immediately, this had to change!
Writing an animated flyout hamburger menu
So I'm currently sitting on a plane at the moment. A recent project I started on was a travel guide where I live. Being on a plane without wifi for a long time is a quick wakeup to me how much I rely on the internet to code.
Taking time away
In case you haven't notice, this blog has not gotten updates much this summer. Some people have even noticed the overall lack of activity on my GitHub. Emails have gone, several weeks unanswered.
Visual Studio 2017, best extensions on launch
When Visual studio 2015 launched, I wrote a blog post titled Resharper without Resharper. This was clearly aimed at giving people the ability in 2015 to divorce themselves from the very expensive product. In writing the post however, I didn't realize people would just want a low down on cool vs2015 extensions.
Making alexa skills in .net
Ok so I've been in the alexa skills market recently, and obviously amazon wants you to use AWS Lambda for your skills. If you are like me, you have a ton of stuff in azure app service (the PaaS of azure). Azure app service supports nodejs, java, python, and of course .net. The two sdk's amazon ships (node, java) do not tie in with a web stack, and are obviously thought of as being used with Lambda.
Exploring the dotnet cli
Now that dotnet core tools have been released I thought it would be good to look into the dotnet cli. This is a new command line interface to build, manage, compile and run dotnet core
based applications
VS 2017, and dotnet core tools. Today will be a historic day
Today marks the release of Visual Studio 2017, and with it the final release of the tools for dotnet core. This means as of today you can build, test, and deploy an application completely supported by microsoft. Not just the runtimes, but the tooling as well. The CLI for dotnet core has been finalized, and its awesome. The csproj system has been revitalized. New csproj's can be created, and are fully compatible with the old. Visual studio 2017 has finally released. This is probably the greatest version of visual studio ever created. Finally VS has gone from a slow, archaic editor, to a fast moving IDE. An IDE with a DevOps-First Cloud-First mentality. An IDE ready to tackle today's modern challenges.
Making a minimal webapp with dotnet core
Recently I wanted to make myself a short url host. Really, I made this not to make short urls, but to make memorable urls for myself.
The wix toolset tl;dr
So recently I have had the (some would say unfortuate) time learning wix. Specifically I am trying to better understand windows installers, mostly to install webapps into IIS with MSI's. This is mostly due to the unfortunate situation where I constantly do work for windows things. I would recommend reading the docs on the wixtoolset website, but if you are still having a trouble understanding how the tools come together, you can read this.
Windows Installer Xml toolset or Wix for short, has been around since the early 2000's. The toolset is one of the great mechanisms to create MSI's. A while back I blogged about how to use them to install ssl certs in IIS. Until recently when I fit the tools together in my head, I couldn't figure out how they work. So here is the tl;dr
Migrating Ghost blog to hexo
I recently ported my ghost blog to hexo, and it was pretty easy.
Checkout my other hexo blogs:
Getting Started with hexo
To get started with hexo run the following commands:
npm install -g hexo-cli
hexo init
npm install
This will drop many files, and folders. The primary one we are going to talk about is the _config.yml
. You will want to start by filling out the _config.yml
file. Name your blog, give a descripton, etc.
Porting your blogs over
To get your data over you will need to go to this url: http://yourblog.com/ghost/settings/labs/
and click the export button. Place the json file at the root of your hexo blog, then run.
npm install hexo-migrator-ghost --save
hexo migrate ghost NameOfYourExportFile.json
Your posts should drop in the posts folder, but the tags will need fixing. Open atom (or another editor that can do find replace in a directory) and replace tags: |
with tags:
in all the files.
Now that it is done we need to fix the paths to your images. Download your images (if you are using azure
you can get them via ftp), and place the folder in the source directory.
Now run hexo server
, browse to port 4000. Your blogs should appear.
Backward compat. urls
We need to make some modifications to make sure the urls are backward compatible.
Set the tag_dir to tag, in ghost the path to tags is /tag.
if your post urls were just /Title then put :title/
in the permalink setting. Otherwise adjust the urls for the proper date format.
RSS
You will want to have an rss feed. You will want to npm install hexo-generator-feed --save
You can then add the following to your config.yml
feed:
type: rss2
path: rss
limit: 0
If you were like me you registered your ghost rss feed to /rss
instead of /rss.xml
. I have no perfect answer to fix this, but I used azure's Url redirect to redirect /rss
to /rss.xml
.
<configuration>
<system.webServer>
<rewrite>
<rules>
<rule name="SpecificRewrite" stopProcessing="true">
<match url="^rss$" />
<action type="Rewrite" url="public/rss.xml" />
</rule>
</rules>
</system.webServer>
</configuration>
If you are using github pages you can use the jekyll-redirect-from
gem.
Hosting hexo in azure webapps
If you have read this blog for any length of time, you know I am a fan of Azure. I thought about using github pages with hexo, but github pages only supports 1 doman name. I could start 301 redirecting my other domains, but I really didn't want to do that.
Why I moved from Ghost to Hexo
Blogging right? I can't believe I somehow stuck with it all this time. Even when I took a long break I still kinda blogged. I got started after being ~~convinced~~ inspired by a coworkers passion to start blogging. To say the least he, and I have very similar tastes, and he turned me on to ghost, and the ghostium theme. After a year and a half of Ghost blogging I have left Ghost.
How the ASP.NET team made the web framework I have always wanted
So I know I do a lot of blogging about C#, or JavaScript, but I actually do a lot of nodejs apps as well as other languages. For a very long time I have not found the stack of my dreams. .NET has always been very close but there were multiple things about the app model that I was not a fan of. I think NancyFX has been the closest framework to my dreams in .NET land.
c++, when should I use the stack or heap?
So I have started learning c++ recently, and as a .NET/Java developer I always want to write the following code.
var s = new myClass()
.
In c++ you have to manage memory yourself, there is no garbage collector.
If you do not use the new keyword var s = myClass()
you will create that class and assign it to on the stack
.
Any stack variables will be cleaned at the end of the block, so in this case s will be cleaned. However if you use var s = new myClass()
s will be allocated onto the heap and must be deleted, otherwise memory leaks will occur.
To clean the variable you must call delete
when you are done with the variable, this will cause the memory in the heap to be cleaned.
Razor Websites, lightweight C# web coding
I was exploring around github, and I stumbled upon an interesting project called Miniblog which was a lightweight blog engine written in c#. The thing that immediately stood out to me was the lack of a .csproj
file.
As I dug around the code I realized this was not a Web App, which most of us were familiar with, but a websites project. I then suddenly realized that the whole thing only used razor!
I am a huge fan of Nancyfx because its much more lightweight than the MVC framework created at Microsoft. To say the least I am a massive fan of small tools, and micro frameworks. So when I realized this whole thing was powered by razor only I was immediately impressed.
I decided to dig around on the internet to see if anyone else was talking about this. I found out quickly that it has been possible for some time, but I didn't find many references about it.
The one thing that bummed me out about the Miniblog example was that it was not a web app. You can use nuget packages will websites, but you cannot make references to other projects in the solution. This was a problem for me, and unlike websites, web app's are precompiled which reduces application startup time.
Saying goodbye to my VPS (..and my opinions of cloud providers)
I have used Linode for quite a long time now. My blog was hosted on linode, as was my StarBound server. My linode was the CentOS Pet I always wanted. Full of manual Fail2Ban configs, I make sure I fed my VPS every day. I even used cowsay to give me a cool message from my pet every login.
The major reason I moved my things away from Linode, was not the devops story itself. I could have stuck with linode, and used chef or something to manage my former friend. I decided to host everything in Azure Web apps. Now before I give you my long ramblings why I like azure; I must tell you. I put everything in azure, because my MSDN gave me free credits. There was no huge scientific analysis behind this. The simple fact that I got free money in Azure was the only reason why I started using it.
VS 2015, Getting Resharper Experience Without Resharper
click here for vs2017
Resharper has long dominated the c# landscape as the tool of tools. Roslyn shipping with VS 2015, the quick actions light bulb, and the community analyzers, all combine to produce a resharper-like experience.
Tip Badges in ghost
So I am a huge fan of ghost, and I love providing my content free of charge. That being said server hosting costs money.
I added a tips badge to the bottom of my blog posts (see below) to try to offset the costs.
Mono, not just a sickness
In the old days, when programming in .NET you were signing yourself up to a lifetime of windows server, however things have changed.
New Series: Windows myths debunked!
Over the last 8 years the demand to scale has ever increased.
We have gone from curating machines like your favorite pets, and started spinning up, and destroying VM's at an ever increasing pace.
As engineers the Unix like platforms, have always been easier to work with. Personally I enjoy linux, I love package managers, I love ssh, and configurations are much easier. That being said, lately I have been interacting a lot with Windows servers.
Excel Interop cannot open my file!
So a while back I made a website that uses the Excel interop (long story). Since I made it a while ago, the IIS configuration is not automated, and must be done artisanally.
Recently I have been working on moving it to a new server. I installed Excel, and the website.
Must Have Tool: NDepend
Code quality tooling has become a bigger, and bigger industry. Tools like Resharper, and stylecop have been telling us how bad us human beings are at developing code.
The one problem I have always had with these tools is they dont go above and beyond to help you understand your code at a higher level.
Watching the Watchers: Monitorama PDX 2014 Day One
I am here in lovely Portland Oregon attending Monitorama. Monitorama is a 3 day open source monitoring convention.
Monitorama had catered food, and drink. The food was plentiful and delicious, and the drinks were amazing.
There were 10 talks, I have made a quick summarization below. I don't have time to write in detail about each one, but I am sure you will get the gist from the basic summary.
Must have tool: LinqPad
LinqPad is an interactive C#/F#/VB.NET scratchpad that lets you run arbitrary C#/F#/VB.NET code, and also lets you query databases with linq.
Admob with Xamarin Android Part 1: BannerAd
This will be a brief overview on how to get admob working with Xamarin.
Disclaimer
I highly suggest you run this on a real phone. I'm not sure if the virtual phones can load content on the internet. I always develop on a real phone.
Sample code located in a repo at github
Setting up robots.txt for your ghost powered blog
Setting up your robots.txt file for your blog is easy, by adding a file called robots.txt in the root of your current themes directory.
iPhone or Android (From a guy living with both)
I know, I know the very first question you ask is going to be why do you have two phones, the answer being One is for work, the other is for my personal life. Now that we are done with that subject, we can get on with the review...
You're doing it wrong (software testing)
One of the major systems that will stop you from losing money is your testing environment. The ability to properly test patches before they are put into production is a must.
Xamarin For Android The Ugly: (Part 3 of 4)
I had some problems with Xamarin. Somethings are ugly, but with plastic surgery almost anything can become beautiful.
Components
Xamarin has its own software packages available for download. I tried a lot of them out, some were good others not so much. One of my biggest gripes was that Google Play Services currently has a bug that makes builds really slow. Other packages were either genius, or were simply unimpressive. The components have their own package manager, and it does do a decent job of keeping them in order. I have to admit though Xamarin has its own set of componants that do in-app billing, and access phone data without having to lift much of a finger.
Component Documentation
A real put down is that only some of the components have adequate documentation. For instance for me to get admob working with play services; I had to look at the Java documentation, and try to figure out how its supposed to be done on Xamarin. This wasn't to difficult, but admob is well used. I would have assumed the documentation would have covered it, but couldn't find anything.
Visual Studio Designer
The Visual studio designer for Android at first seemed like the best thing since sliced bread! I was able to get a UI up and running in no time. Making my app work for tablets, and mobile phones alike was simple. However, once in a while it would be stubborn, and stop working. I'm not sure if it was something I was doing, but I felt like it would bomb out and I would have to restore the XAML file to continue.
The editor really isn't great for designing ListViews, working with fragments, or making something that will scale easily. Often it made things exact pixel widths instead of using dots per inch. To keep it short, I still had to do plenty of editing of the source manually (which was not too bad). Making the theme stick on the default view was a pain, until I realized that I could ignore the editor, and decorate my MainActivity with the theme I wanted to use.
[Activity(Label = "Label", MainLauncher = true, Icon = "@drawable/Icon", Theme = "@android:style/Theme.Holo.Light")]
Xamarin For Android The Good: (Part 1 of 4)
Introduction
- Part One
- Part Two
- Part Three
- Part Four
This will be a series of blog entries where I discuss the Xamarin platform for Android.
I really enjoy C# programming language (JavaScript second)....Linq, Generics, anonymous methods, and Visual Studio are just some of the reasons I like it. Xamarin is a platform that gives you the ability you to write Android applications in c#.
When I heard about Xamarin I naturally, wanted to give it a shot. Having tried Eclipse, and Android Studio for android development I was no idiot when it came to the platform. So I got a license, and did nothing with it for six months, until a few weeks ago. After only 3 days I created Ultimate Gravatar Sync. An app that sync's your contacts gravatar images to their picture in your phone.
C# with no compromise
The Xamarin platform uses mono, and some kind of voodoo bindings to the Java libraries to make it work. I wont go in depth, but the native features of the C# language are there to use. I never felt like my hands had been tied, that all of a sudden I couldn't use a library that is normally part of the GAC (Global Assembly Cache). When I needed multi-threading, System.Threading was there, and when I needed to use C# Generics I had no issues implementing them.
Manage Android Manifest files
One of the things that blew me away about the platform, was that I never had to add anything to my manifest file. For those of you whom don't know, Android requires an XML config detailing the permissions you require, and the classes you have in your application.
Simple decoration such as:
[Activity(Label = "Label", MainLauncher = true, Icon = "@drawable/Icon")]
Will Generate in your manifest file as:
<pre>
<activity
android:label="Label"
android:name=".logoActivity" >
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
</pre>
Adding permissions is also easy:
[assembly: UsesPermission(Android.Manifest.Permission.Internet)]
Using Java Libraries
Xamarin provides some kind of crazy visual studio project, that will essentially provide c# bindings to Java libraries you require. To bind Simply create a Java Binding project, adding the .Jar files, and then build. Watch the magic happen. They do note that you sometimes need to do some configuration for certain libraries, however I had no issues with the one I tried. On top of that if you really needed to, you could access the Java Native Interface for even more power.
You're doing it wrong! (Recruiter Edition)
Recruiting, I am sure is a tough job (I wouldn't actually know), but often being on the other end I see pitfalls that a lot of recruiters fall into. So for all of you recruiters, please do not do these things.
...A blog about technology, how original(not)!
Introduction (who am I?)
Hello, Tommy here. I work at vistaprint. I spend most of my time monitoring a website, writing internal tools, and doing things some would consider "Devops".
I'm not very qualified as a blogger, quite frankly my English skills are terrible.
My perspective is not very unique at this point. The industry is full of developer/sysadmin employees, and devops has become an industry movement. This movement has created in my opinion a 'trendy effect' to what some would consider little more than a buzz word.