The blog for this plan was one I had well into the Xmas Annual Leave but thankfully I already had a pretty good idea of my plans already before the Leave started.
It helped that I had my probation period meeting (which I passed btw) with some recommendations shortly before the beginning of my Annual Leave.
In the criticisms of my initial 3 months it was made clear I could have been faster to learn legacy code but that my code quality was good and various other aspects. I want to focus on what could be improved here as it basically decided what I would be doing with my holidah and continue to do as the holiday progresses.
I’m Buddhist and have never been very fond of Christmas anyway. I also live alone so see no special reason or have any special desire to treat the day or holidays any differently than I do others. I do and always have seen Annual Leave when not abroad as an opportunity to work on my own projects. Whether they be my home network of Raspberry Pis and their clones or Home Assistant and its modules. However this year I decided after being told I need to ‘improve my legacy code pick up’ that this holiday’s plan is:
See how far behind they are and if they are legacy code I’d create a new repo or branch to bring the old code up to speed (practice makes perfect).
Find dead projects others have abandoned on Github to resurrect and polish them off to support the version I use at work. E.g. PHP5.4 library upgrade to PHP7.3+ library. If it uses a technology from work I don’t know then all the better - two birds one stone.
Update Github badges (Appveyor, CircleCI, TravisCI) with the latest build actions and paths so they have more accurate and up-to-date CI/CD pipelines.
Update my LinkedIn profile as I no longer have to be defined by my horrible time at XBite Chesterfield, which really knocked my confidence.
Use my Big List of Ideas I keep in Todoist to create new projects or find old, existing projects that are similar but need some work to get some regular coding practice.
The above activities should make me better at picking up old code and bringing it up to speed with the latest version - exactly what I didn’t do well at probation. Thereby making this a holiday that benefits me because I get a break (coding is a hobby as well as work) and work gets a better coder.
Gitlab’s CI/CD features are second-to-none. Its one of the main reasons I switched from Github to Gitlab along with the free private repos back in the day. GitHub’s Actions and plugins have closed the gap in features a little but Gitlab still has the greatest level of customisability. Though its user friendliness could be tweaked a bit. In this post I’m going to detail how you can setup Sitespeed.io’s checking of a site in your Gitlab CI/CD pipeline.
To pull this off you need to have a few prequesites:
Use Gitlab pages to deploy your site.
Use Gitlab CI/CD pipelines to deploy your site (which means you’ll have a .gitlab-ci.yml file)
I’m not 100% sure you need the above but thats what this tutorial assumes you have. You may be able to get this working with Netlify deployment but I’m not sure. That’d be an exercise for yu to figure out.
It’s a fully open source docker image and website that provides docker images with various differwnt browsers that are used to process performance reports of websites. There’s a high level of customisability with a list of the arguments available in their documentation. Many of these arguments can be used as part of your Gitlab CI setup file.
Here’s just a few simple screenshots of the report that gets generated.
You can get the report by visiting CI/CD > Pipelines > Click the icon at the far right of the pipeline with a download icon that will give you the options to download multiple artifacts. The one you want is likely lablelbed something like performance (shown below). After downloading you’ll need to unzip it and visit the index.html file of the report to begin looking through all the generated metrics.
You can get a full report of my the last performance report of this site at this link.
How to Make Use of SiteSpeed on Gitlab
There is official documentation showing its use but its not the most comprehensive. I hope to post a few examples here that you can use in your own projects.
HexoJS Site Performance Test
This blog is hosted using Gitlab Pages generated by HexoJS (a static site generator that uses Markfdown files for posts and pages). Hexo have a basic Gitlab Pages devops config on their site but we’re going to take that and convert it into something that includes the Sitespeed checks we’re discussing here:
Note the use of different arguments in this case to SITESPEED_OPTIONS. I this case it will follow links to a depth of one meaning it will follow just links from the homepage when presenting its performance report. However, the -m option ensures it tests a maximum of 30 pages.
test: stage:test script: # this configures Django application to use attached postgres database that is run on `postgres` host -exportDATABASE_URL=postgres://postgres:@postgres:5432/python-test-app -apt-getupdate-qy -apt-getinstall-ypython-devpython-pip -pipinstall-rrequirements.txt -pythonmanage.pytest
To structure your yaml file the best you can make sure its got stages like this and you’ll be able to download the files for each stage seperately from the pipelines section of the site:
1 2 3
stages: -test -deploy
3. Make sure performance has everything it needs
The performance section is pretty easy to setup as you can see from the examples. The only part you need to consider is the SITESPEED_OPTIONS section which I’ve already linked to the documentation of but something like thsi would work fine:
This is just the beginning. Gitlab also offer an accessibility checker template for your pipeline so you can assess the accessibility of your site after every build as well as the performance. So thereby having 2 great reports to consider and help you improve your site for your visitors. I may cover the accessibility testing in a future post. I hope this has been useful to some.
Do you need a static site generator?
It makes clear in the documentation that you can use a dynamically generated site which I assume means a site built using something other than a static site gen but you have to be sure to make the performance stage only run once the deployment stage has run and it could then be used to output several URL’s for testing instead of just one.
What static site generators does this work for?
Pretty much any of them. This will work with any site where the source is hosted on Gitlab and its entirely free. So whether you’re using Hugo Jekyll, Hexo or something else then you should be able to use it in a similar fashion to the above. Be sure to check out your static site generators documentation for a basic .gitlab-ci.yml file that can be altered for your use.
Anyone who’s spent more than 5 minutes on the MySQL documentation will realise it leaves a lot to be desired. The same goes for many of the 3rd party apps latched onto this platform which offer mediocre functionality and anything beyind the basic comes at a huge premium.
Well here’s a set of 20 resources, tools, articles that hope to break that and bring it all under one roof. Enjoy.
Design & Administration Tools
Adminier - A really simple PHPMyAdmin alternative. I find it useful as a basic database administration panel during development of new web-based projects.
MyDB Studio - Makes a useful administration app for MySQL and also has some design capabilities such as the SELECT wizard to help with overly complicated queries.
HeidiSql - Provides an excellent GUI for administrating you MySQL database and can be used in Linux via WINE.
AutoMySQLBackup - Why go to the special effort of producing scripts to backup when you can use this.
PHPMyAdmin - Been around for years and still going strong. Its not the most speedy when handling large sets of data (try offline apps such as SQLYog or MyDB) but its got every functionality you can shake a stick at.
DBeaver - Similar to HeidiSQL but with better features and works on multiple platforms including Linux.
SQLIer - A SQL injection tool which you provide a URL to and it does all it can to perform SQL injection. You’ll often find this installed by default on security distros like Kali or ParrotOS Security. SQLMap - A blind SQL injection tool thats a veteran with a plethora of features that makes SQLIer look like a Hello World app in comparison. It provides support for PostgreSQL, MSSQL as well as MySQL. Absolutely essential for people performing pen testing against a server. Will often be installed by default on Kali Linux, Black Arch, ParrotOD, etc. Absinthe - An application which is available on Linux and Windows. It provides blind MySQL injection brute forcing but with more features than SQLIer. SQID - SQL Injection Digger was created in Ruby as a command-line tool for brute force SQL injection testing. Can scrape Googl for potential targets as well as using Tor as a means to hide the identity of the attacker. More of a black hat tool than some of the others here.
This review is coming pretty late since I completed the course last year but having found out its still an option on Coursera, and there’s been a huge proliferation of Google Cloud Platform (GCP) courses since, I wanted people to know how great this one was.
As a “Specialisation” on Coursera that means it is part of multiple courses and Coursera offer a monthly charge for all courses. So there’s an economical reason to finish the courses in good time and not laze about - as the course does allow you lose deadlines.
So I completed all the 4 courses in the 1 month suggested without any deadline extensions receiving distinction in all of them.
As mentioned previously the specialisation contains multiple related courses which - if you wanted - you could complete individually and pick n mix them to your hearts content. But choosing the specialisation path ensures you get a good grounding in the subject offered:
You can get information on the individual courses at Coursera.
Free Qwiklabs access was a huge boon to this course as it allows you free access to the Google Cloud console and services for a limited time to do with as you please giving you teh opportunity to learn practically with the actual tools you would be using.
Every course in the series including the first intro course had some lab or another in Qwiklabs with some offering several. The tasks weren’t massively difficult but for the price and considering it was offered alongside lectures and notes it was a great addition to the course.
Basically the courses had everything you could want: lectures, notes, documentation, forums to ask questions and finally practical lab based work. It actually felt a lot like some of my university courses and if you were dedicated and made use of it all you would get out of it what you put in.
As a web developer by trade I was disappointed that a GCP course with the words “Developing Applications” in the title had absolutely ZERO development. It was all the techniques and technology needed and surrounding development on the Google Cloud platform. I don’t so much as remember even doing a single "Hello World in Node or Python for one of the Qwiklabs. It was a major, major failing of the course and they should probably rename it as the course’s rating of 4.6 is probably due to it lacking the development aspect and its also the reason that since doing that course I’ve been put off doing any Coursera course since.
Yes, its a great course. Yes, you get a ton of content. Yes, I felt happy with what I got. But NO - don’t call a course “Developing Applications” then have zero development in it. It was a real slap in the face and as I came to the end of the course I wanted to ask for my money back but couldn’t see any recourse to get it.
So be warned. If you want to do this course thinking you’ll get the chance to develop a small cloud-based web app. Don’t. You won’t. It tells you about containers, pulling code, pushing it. Moving it around, monitoring it. Everything surrounding development. But no actual development.
One of the things this criticism made me realise is that the cloud is a complex place that involves a lot of work to get programs working. So much so an entire 1 month course split in 4 doesn’t even have any programming in it. Its entirely dedicated to showing you the basics of getting code to the point it’ll work.
I’ve always hated it when reviews end with an indecisive comment aht could be trotted out by anyone about anything. So I aim to do the opposite.
The course was excellentbut it wasn’t what I expected. If you’re expecting to program like the title says you won’t be doing. You’ll be doing everything involved in getting programs to work on the cloud.
The cloud isn’t for hte faint of heart. If you want to learn cloud technology I suggest you pick one and get to know it well as they’re all becoming increasingly complex as time goes on.
I’ve recently been getting into Gridsome while looking for a way to create a long planned project to create an
MP Search Service (more info on that soon hopefully with a full tutorial on setting up your Gridsome site from a REST API).
I’ve considered other options such as Hexo and NuxtJS but I was keen to take advantage of Gridsomes claimed ability to hook into multiple content providers and API’s and create a GraphQL data layer to query this data for creating pages.
Obviously when you’re planning a new site you start thinking about the look & feel.
I opted to use the TailwindCSS plugin to create a very utilitarian theme.
But I thought it’d be a good idea to help anyone out there on the look out for ready made themes.
Gridsome isn’t like other static site generators so doesn’t really have a theme library like Hexo but there’s
a number of great starter projects and other options you can use to get a good looking site.
Probably the best place to start as this isn’t just themes its a whole site dedicated to finding the right starting project for your site. As mentioned previously Gridsome can be bent to any whim you fancy so it can work from Markdown files as easily as it can work from a new articles API.
Gridsome starters aims to help people find the right type of site first ythen gives you a simple theme to start off from there.
A small list of themes provided by JAMstack who also have numerous other themes for other static site generators. Most of these themes are quite basic and some work like the starters like the above with some being built with Netlify CMS in mind or Airtable.
It’s worth remembering that Gridsome is a wholly VueJS framework. So anything buiult with Vue in mind is compatible with Gridsome. So this site dedicated to VueThemes is well worth a look as they can all be installed and used within your Gridsome website/app.