Jamie Balfour

Welcome to my personal website.

Find out more about me, my personal projects, reviews, courses and much more here.

Jamie Balfour'sPersonal blog

Over the last few days, my main project to keep me occupied during my recovery has been DASH 2.0. This has been a momentous task to redevelop. I say this because DASH 2.0 is almost identical to Dash 1.x in appearance, and yet massively different underneath. And yet, whilst this is true, the whole codebase has been almost entirely rewritten to take advantage of the new object-oriented design.

By moving from the static and singleton design patterns implemented within Dash 1.x, DASH 2.0 makes multiple content management systems in one much easier. On my website, I store a single preferences PHP file at the root of my server. DASH connects to this to obtain the appropriate information, allowing it the user to select between four different zones on my website - that is, my blog, reviews, articles and my test blog (which is now on DASH 2.0).

Much like my website DASH 2.0 now moves to the Quicksand font.

A few days ago, I updated the page about Dash to explain what is happening. I'm very pleased to announce DASH 2.0 (note the new styling of the word DASH as it is now uppercase due to being an acronym).

DASH 2.0 is much better designed, making it easier for me to update it. Further to that, the core model of DASH 2.0 makes DASH 2.0 uncoupled from the DASH Board side. This means that one install multiple blogs/content should be easier to implement than the poorly put together system I developed with Dash 1.0. 

Over the next few weekends, I aim to build a completely new DASH Board that will support DASH 2.0. This is a big job but it's mostly to get my brain working again after having a few weeks of not really doing much (except watching several TV series) and because I promised that I would redevelop it. 

I aim to keep the front-end the same where I can and will be reusing parts of it where I can. Below is how Dash 1.0 looks as of just now.

What is more exciting at present is that I have updated my own blog, articles and reviews to use DASH 2.0 for the front-end and updated the old Dash 1.0 Dashboard to use the new system - it was relatively simple to update too!

The old Dash dashboard

The collapse of People's Energy is very sad for me personally because I was there right back at the start interviewing for a job over a cup of tea with David when the company was only just starting up and was one of the first to apply for a job at the company.

The job was for a website developer but also as a kind of senior role in charge of others which would have been really good fun. I do not remember how I came across the job, but it was all very top secret at the time. I remember bits and bobs of that day, for example, visiting Falko's restaurant in Gullane for the very first time and also that they mentioned that the company wasn't approved at that point by Ofgem (which I have looked up and actually it was the case). 

The job, which I applied for after leaving MagLabs in July 2017, was for someone to develop a web-based interface to manage their systems. 

I ended up having to say no to the job if I remember correctly, simply because I had already accepted another job. It brings back memories and who knows what I would be doing now if I had gone with them. 

The Collatz conjecture, named after Lothar Collatz who introduced the idea is a perfect example of a mathematical problem that cannot be solved by mathematics and the tools available within the domain and scope of mathematics of today.

It goes a little like this:

$${\displaystyle f(n)={\begin{cases}{\frac {n}{2}}&{\text{if }}n\equiv 0{\pmod {2}}\\[4px]3n+1&{\text{if }}n\equiv 1{\pmod {2}}.\end{cases}}}$$

it's a nice little conjecture to turn into a program, so I decided to write it in YASS to try and demonstrate this based on the above syntax:

YASS
function f ($n)

  if($n % 2 == 0)
    $n = $n / 2
  else
    $n = ($n * 3) + 1
  end if

  return $n

end function

$n = input("Please insert a start number")

$iterations = 0
print($n)
while($n != 0 and $iterations < 5)
  
  $n = f($n)

  print($n)
  if($n == 1)
    $iterations++
  end if
end while

It's hard to believe, but since just under a month ago I have been over 30 years of age. But so too has the world wide web.

I was discussing this yesterday with someone and discussing how the w3 has evolved from being a simple document sharing system into something that allows you to build and use powerful applications within it. I say this because on Monday I went to one of my favourite restaurants and they use a web app to manage everything, and I say everything. It's very impressive.

Anyway, take a look at How To Geek for more information on this:

https://www.howtogeek.com/744795/the-first-website-how-the-web-looked-30-years-ago/

Posted in Tech talk
www
w3
changes
history

I first introduced my tutorials back in 2012 when I began refurbishing my website. Since then they have become incredibly popular (I use a page visit counting algorithm that I have developed and I have noticed a huge spike in visitors to my reviews and tutorials over the last few months, with an average of around 500 visitors a day).

However, it struck me that in reality, my tutorials are not so much 'tutorials' but free online courses. I say this because when I look at say, my CSS tutorial, it doesn't focus on doing things in CSS like websites such as CSS Tricks does, but instead it focuses on giving a solid platform to build upon. For example, it teaches some of the core features like backgrounds and border-radii, but not more advanced things like the clearfix model or how to add gradient borders as I have been doing on my website.

From today on, these tutorials are now rebranded as my Courses and they will continue to be free, as with many of the resources I provide.

Not that I like reminding myself, but these are the last few hours of my twenties. In less than 10 hours (I was born at 10.31) I will turn 30 years old. I'm not sure I feel like I am thirty, I still feel a lot younger than that...

Today's date

I did a lot during my twenties - I got through and survived cancer, I got my first class degree, I got my first work experience, I got my PGDE, I got Charlie and I bought my own house (which I love). My twenties also had some bad things in them like losing Petro, Gismo, Henry and Sweep. I met some really great people like my pal Jonathan, Merlin, Mark etc at uni, and Beth and Campbell during my PGDE. I also got to meet some people with who I've become friends with (to name a few Grant, Daragh, Moira, Brian, Mel, Louise, Michael, Grant and Ann).

In terms of looking back at my twenties, I'm going to create an article as I did with the last decade. It might coincide with that one slightly since they are almost parallel.

Here is a video I found just today about the world's richest people. I found one a few years ago about the world's biggest brands, similar to this.

In the last few hours, I have been working on improving the information architecture and the URLs for my tutorials. For the last six or seven years the way the URLs to my tutorials have looked is like this:

/courses/web/css/1/2/

Now, with a bit of work, I've written a much more beautiful system, and that makes the URLs look like this:

/courses/web/css/using_css/

The new system uses URL rewrites alongside a clever automated (cron) generated JSON in which all of the titles are given friendly names:

JSON
[{
  "page_name": "What this tutorial is",
  "category": "web",
  "category_name": "Web",
  "topic": "css",
  "topic_name": "CSS",
  "route": "/courses/web/css/1/1",
  "area": "1",
  "page": "1",
  "title": "what_this_tutorial_is",
  "friendly_path": "web/css/what_this_tutorial_is"
}, {
  "page_name": "What CSS is",
  "category": "web",
  "category_name": "Web",
  "topic": "css",
  "topic_name": "CSS",
  "route": "/courses/web/css/2/1",
  "area": "2",
  "page": "1",
  "title": "what_css_is",
  "friendly_path": "web/css/what_css_is"
}, {
  "page_name": "Using CSS",
  "category": "web",
  "category_name": "Web",
  "topic": "css",
  "topic_name": "CSS",
  "route": "/courses/web/css/2/2",
  "area": "2",
  "page": "2",
  "title": "using_css",
  "friendly_path": "web/css/using_css"
}, {
  "page_name": "Why CSS is used",
  "category": "web",
  "category_name": "Web",
  "topic": "css",
  "topic_name": "CSS",
  "route": "/courses/web/css/2/3",
  "area": "2",
  "page": "3",
  "title": "why_css_is_used",
  "friendly_path": "web/css/why_css_is_used"
}, {
  "page_name": "Classes, IDs and tag selection",
  "category": "web",
  "category_name": "Web",
  "topic": "css",
  "topic_name": "CSS",
  "route": "/courses/web/css/2/4",
  "area": "2",
  "page": "4",
  "title": "classes_ids_and_tag_selection",
  "friendly_path": "web/css/classes_ids_and_tag_selection"
}, {
  "page_name": "Display, positioning, floating and visibility",
  "category": "web",
  "category_name": "Web",
  "topic": "css",
  "topic_name": "CSS",
  "route": "/courses/web/css/3/1",
  "area": "3",
  "page": "1",
  "title": "display_positioning_floating_and_visibility",
  "friendly_path": "web/css/display_positioning_floating_and_visibility"
}, {
  "page_name": "Width, height, padding, margins and overflow",
  "category": "web",
  "category_name": "Web",
  "topic": "css",
  "topic_name": "CSS",
  "route": "/courses/web/css/3/2",
  "area": "3",
  "page": "2",
  "title": "width_height_padding_margins_and_overflow",
  "friendly_path": "web/css/width_height_padding_margins_and_overflow"
}, {
  "page_name": "Borders, box shadows, border radius and box sizing",
  "category": "web",
  "category_name": "Web",
  "topic": "css",
  "topic_name": "CSS",
  "route": "/courses/web/css/3/3",
  "area": "3",
  "page": "3",
  "title": "borders_box_shadows_border_radius_and_box_sizing",
  "friendly_path": "web/css/borders_box_shadows_border_radius_and_box_sizing"
}, {
  "page_name": "Color, backgrounds, opacity and gradients",
  "category": "web",
  "category_name": "Web",
  "topic": "css",
  "topic_name": "CSS",
  "route": "/courses/web/css/3/4",
  "area": "3",
  "page": "4",
  "title": "color_backgrounds_opacity_and_gradients",
  "friendly_path": "web/css/color_backgrounds_opacity_and_gradients"
}, {
  "page_name": "Font families, sizes, weights, variants, styles and alignment",
  "category": "web",
  "category_name": "Web",
  "topic": "css",
  "topic_name": "CSS",
  "route": "/courses/web/css/3/5",
  "area": "3",
  "page": "5",
  "title": "font_families_sizes_weights_variants_styles_and_alignment",
  "friendly_path": "web/css/font_families_sizes_weights_variants_styles_and_alignment"
}, {
  "page_name": "Descendant selector",
  "category": "web",
  "category_name": "Web",
  "topic": "css",
  "topic_name": "CSS",
  "route": "/courses/web/css/4/1",
  "area": "4",
  "page": "1",
  "title": "descendant_selector",
  "friendly_path": "web/css/descendant_selector"
}, {
  "page_name": "Child selector",
  "category": "web",
  "category_name": "Web",
  "topic": "css",
  "topic_name": "CSS",
  "route": "/courses/web/css/4/2",
  "area": "4",
  "page": "2",
  "title": "child_selector",
  "friendly_path": "web/css/child_selector"
}, {
  "page_name": "Adjacenct sibling selector",
  "category": "web",
  "category_name": "Web",
  "topic": "css",
  "topic_name": "CSS",
  "route": "/courses/web/css/4/3",
  "area": "4",
  "page": "3",
  "title": "adjacenct_sibling_selector",
  "friendly_path": "web/css/adjacenct_sibling_selector"
}, {
  "page_name": "General sibling selector",
  "category": "web",
  "category_name": "Web",
  "topic": "css",
  "topic_name": "CSS",
  "route": "/courses/web/css/4/4",
  "area": "4",
  "page": "4",
  "title": "general_sibling_selector",
  "friendly_path": "web/css/general_sibling_selector"
}, {
  "page_name": "Universal selector",
  "category": "web",
  "category_name": "Web",
  "topic": "css",
  "topic_name": "CSS",
  "route": "/courses/web/css/4/5",
  "area": "4",
  "page": "5",
  "title": "universal_selector",
  "friendly_path": "web/css/universal_selector"
}, {
  "page_name": "Attribute selector",
  "category": "web",
  "category_name": "Web",
  "topic": "css",
  "topic_name": "CSS",
  "route": "/courses/web/css/4/6",
  "area": "4",
  "page": "6",
  "title": "attribute_selector",
  "friendly_path": "web/css/attribute_selector"
}, {
  "page_name": "An introduction to pseudo-selectors",
  "category": "web",
  "category_name": "Web",
  "topic": "css",
  "topic_name": "CSS",
  "route": "/courses/web/css/5/1",
  "area": "5",
  "page": "1",
  "title": "an_introduction_to_pseudo-selectors",
  "friendly_path": "web/css/an_introduction_to_pseudo-selectors"
}, {
  "page_name": "Advanced CSS pseudo selectors",
  "category": "web",
  "category_name": "Web",
  "topic": "css",
  "topic_name": "CSS",
  "route": "/courses/web/css/5/2",
  "area": "5",
  "page": "2",
  "title": "advanced_css_pseudo_selectors",
  "friendly_path": "web/css/advanced_css_pseudo_selectors"
}, {
  "page_name": "Shorthand CSS",
  "category": "web",
  "category_name": "Web",
  "topic": "css",
  "topic_name": "CSS",
  "route": "/courses/web/css/6/1",
  "area": "6",
  "page": "1",
  "title": "shorthand_css",
  "friendly_path": "web/css/shorthand_css"
}, {
  "page_name": "Precedence and specificity",
  "category": "web",
  "category_name": "Web",
  "topic": "css",
  "topic_name": "CSS",
  "route": "/courses/web/css/6/2",
  "area": "6",
  "page": "2",
  "title": "precedence_and_specificity",
  "friendly_path": "web/css/precedence_and_specificity"
}, {
  "page_name": "CSS rules",
  "category": "web",
  "category_name": "Web",
  "topic": "css",
  "topic_name": "CSS",
  "route": "/courses/web/css/6/3",
  "area": "6",
  "page": "3",
  "title": "css_rules",
  "friendly_path": "web/css/css_rules"
}, {
  "page_name": "Optimising CSS delivery",
  "category": "web",
  "category_name": "Web",
  "topic": "css",
  "topic_name": "CSS",
  "route": "/courses/web/css/6/4",
  "area": "6",
  "page": "4",
  "title": "optimising_css_delivery",
  "friendly_path": "web/css/optimising_css_delivery"
}, {
  "page_name": "Cross platform and browser compatibility",
  "category": "web",
  "category_name": "Web",
  "topic": "css",
  "topic_name": "CSS",
  "route": "/courses/web/css/6/5",
  "area": "6",
  "page": "5",
  "title": "cross_platform_and_browser_compatibility",
  "friendly_path": "web/css/cross_platform_and_browser_compatibility"
}, {
  "page_name": "Server-side generated CSS",
  "category": "web",
  "category_name": "Web",
  "topic": "css",
  "topic_name": "CSS",
  "route": "/courses/web/css/6/6",
  "area": "6",
  "page": "6",
  "title": "server-side_generated_css",
  "friendly_path": "web/css/server-side_generated_css"
}, {
  "page_name": "CSS and Sass",
  "category": "web",
  "category_name": "Web",
  "topic": "css",
  "topic_name": "CSS",
  "route": "/courses/web/css/6/7",
  "area": "6",
  "page": "7",
  "title": "css_and_sass",
  "friendly_path": "web/css/css_and_sass"
}, {
  "page_name": "An introduction to responsive web design",
  "category": "web",
  "category_name": "Web",
  "topic": "css",
  "topic_name": "CSS",
  "route": "/courses/web/css/7/1",
  "area": "7",
  "page": "1",
  "title": "an_introduction_to_responsive_web_design",
  "friendly_path": "web/css/an_introduction_to_responsive_web_design"
}, {
  "page_name": "Tablet and smartphone friendly CSS",
  "category": "web",
  "category_name": "Web",
  "topic": "css",
  "topic_name": "CSS",
  "route": "/courses/web/css/7/2",
  "area": "7",
  "page": "2",
  "title": "tablet_and_smartphone_friendly_css",
  "friendly_path": "web/css/tablet_and_smartphone_friendly_css"
}, {
  "page_name": "CSS transform",
  "category": "web",
  "category_name": "Web",
  "topic": "css",
  "topic_name": "CSS",
  "route": "/courses/web/css/8/1",
  "area": "8",
  "page": "1",
  "title": "css_transform",
  "friendly_path": "web/css/css_transform"
}, {
  "page_name": "CSS transitions",
  "category": "web",
  "category_name": "Web",
  "topic": "css",
  "topic_name": "CSS",
  "route": "/courses/web/css/8/2",
  "area": "8",
  "page": "2",
  "title": "css_transitions",
  "friendly_path": "web/css/css_transitions"
}, {
  "page_name": "CSS counters",
  "category": "web",
  "category_name": "Web",
  "topic": "css",
  "topic_name": "CSS",
  "route": "/courses/web/css/8/3",
  "area": "8",
  "page": "3",
  "title": "css_counters",
  "friendly_path": "web/css/css_counters"
}]

On the front end, the page is found via its friendly_path value. To keep the order correct, the pages are not given a key. Although it would make it slightly faster to give them this key, it would mean that the order isn't correct any longer.

Changes to title names will actually break the system and any changes made will need to be followed by a running of the automated script (which happens every evening anyway).

I'm still testing this feature out, so if you find any bugs, let me know. 

ZPE 1.9.7 (Galashiels) is one of the most solid updates yet. Many major bug fixes have been introduced, new performance gains and a new typing system (TYPO v2). 

TYPO v2 is perhaps the biggest improvement to the whole ZPE Programming Environment in the last few months, and it changes the whole way that it works underneath. Instead of doing type checking at compile time and thus making starting and interpreting programs/scripts slower, it is now done at runtime. The impact here is actually slightly smaller and relies on the underlying implementation of variables to perform this check. 

TYPO v2 also removes the STRONG_TYPED property from the properties list and allows side by side strongly typed, statically typed and weakly, dynamically typed variables to be declared side by side in a single program or script. 

All ZPE/YASS documentation has been updated to reflect this new change, particularly the page on Assignment and variables.

ZPE 1.9.8 is looking to use more static hidden objects to improve both performance and lower memory usage. This might be another big update.

Powered by DASH 2.0