Building A Website

📅 July 22, 2019

•

⏱️5 min read

So, the fist blog post, here goes...

I built a frigging website! Yay!

By built, I mean, I'm no developer, but I actually wrote code that made webby things happen and I am very happy about it. Granted, I didn't write all of it, but this is the state of things, you borrow something from here, something from there, tweak one bit, delete another bit and slowly but surely it all comes together.

The internet is full of wonderful guides telling you how easy it is to get a website going and why you should do it RIGHT NOW!. Many of them are stretching the truth of how simple it is, others are just plain lying, and almost all of them want to charge you some of your hard earned cash for their 'easy' solution. Easy is relative, it's only easy when you know how, right? There's a reason that web development is a highly skilled career that people train for many years for. I tried several of the various template builders, the drag and drop widgets that let you create in a very visual way without writing a single line of code and they're mostly good, but for someone like me who wants to know how everything works and why, it didn't feel right.

Baby steps

Getting to this point has been a series of incremental steps over years of fiddling with code and a fascination with automation. The way I see it, if you can get a machine to perform a repetitive task for you, or even better teach it a method that it can use to perform a task better than you can alone, then you should do that. Then revel in your achievement and go enjoy the time you saved by doing something enjoyable, like drinking tea.

It started at work. I'm an Engineer and deal with a lot of numbers day to day, numbers demand the use of spreadsheets, often Microsoft Excel spreadsheets. I don't remember how, but I discovered Visual Basic for Applications (VBA). VBA is built in to most Microsoft Office applications (as well as many other non-Microsoft programs) and allows you to code processes to do stuff for you, repetitive stuff in particular, which in turn allows more time for drinking tea. So I started using VBA a lot, I created things to save me time and things that I could share with other people to make their lives easier too, it was very rewarding stuff! So as time went on I learnt more just by doing, more ways to automate, more intricate things to code, more efficient ways of doing the same thing, just more everything.

I looked at writing websites many years ago and then looked away again very quickly, it was so confusing, you had to give your website a layout to work with (HTML) then you had to design what that layout looked like (CSS) then you had to give it instructions on what to do when something happened (JavaScript). Then! If you wanted to interact with any data, fetch it, save it, etc. then you needed a server and more programming on that too. Three or more different languages to learn to achieve what seems like just one thing and I wasn't even that interested in building a website, what could it do for me? I didn't see the benefit and it felt like there were too many roadblocks. Then, some years later, I discovered Raspberry Pi, which would eventually set me back on the web development track. An avalanche of learning began! You can code on Raspberry Pi in a language called Python and use it to interact with physical things. Python in turn is used web technology quite a lot, I understand that it's great for data analysis, crunching mindboggling amounts of data for our online lives. So, I do an online course in Python, a really great one. I learn not just Python but more advanced programming techniques that open more doors and raise more questions. Now I have a hunger for more learning.

I'd kept dabbling with various languages and learnt tons but still, websites and web apps felt foreign and awkward. I couldn't get my head around how the numerous elements had to work together and I'm still far from confident. I did a few more online courses and then stumbled across two technologies, React.js about a year ago and then in the last couple of months, Gatsby.js. React is like web development Lego, you build a component (a brick) and then you can use it over and over again to build something bigger. If you change something in the core of the brick design, all the bricks change, wonderful! It felt familiar to what I'd done for a long time with CAD, change one dimension in a component and the whole assembly changes with it in glorious harmony. React handles everything in one neat package, it's complex but it feels more manageable. Gatsby works with react and takes away another complexity, the server. Gatsby only creates static sites, sites without complex servers and databases. Great for simple sites that don't need to change rapidly. This site is built with Gatsby and if I create a new blog post, the whole site gets rebuilt with the new page so there's no database connection to try and handle. I can use the React building blocks with Gatsby's simple suite of plugins and here we are. I've grossly over-simplified but hopefully you get the gist. Gatsby even has some well supported templates so getting started is relatively simple and you can make it as complex as you like. Both are open-source and have huge communities, so there is help everywhere.

Why a website?

I knew that if I persisted I would unlock at least some of the answer to the 'how does it work' question. That's it, that was the only real motivation. Web technology is truly wonderous and if you can bend it to your will then that's a wonderful skill to have, I don't have it but I like the idea of it. I'm not entirely sure what I'll do with the site yet. I have a few ideas I don't think I'll ever lose interest in trying to learn more interwebs and likely use it as a place for experiments. The blog will be a nice way for me to vent things that I'm interested in and if someone likes to give it a read and they get some kind of pleasure out of it then great. If not, that's ok too, what are you still doing here?

Some of the courses I've taken.

Finally, props to the guy who created the wonderful template that this site was based on. you can find it here, gatsby-starter-gcn.

← Prev Post