A website and a JavaScript Game

Tony Ascroft © 2018

This week is one of many future ‘updates’. As well as writing posts on specific items, I’m going to try to do a weekly update of where I’m at and what my plans for the immediate future are.

Last week I finished two projects, posted them to Git Hub and linked them to my website. The first is a JavaScript project from the book Head First JavaScript. It’s a version of Battleship that you build step by step as you follow along. To get the most out of this, and any step-by-step project, I’d recommend typing out the code yourself rather than downloading the available pre-written code, and going over it until you understand what its doing step by step. One of my strengths is my art and design abilities so I used that knowledge to create a new interface for the game.

I also created a tribute page to a car company I’ve been interested in since I was about 15. I came at this project with three things in mind.

  1. wanted to add three dimensional elements.
  2. I wanted to avoid the stock Nav Bar you see on so many sites these days.
  3. I didn’t want to the viewer to have to scroll.

I mostly used Bootstrap 4.0, and Flex (now built into Bootstrap) and I did instill one limitation on myself. I had to actually understand the code I wrote (libraries excepted). No copy and paste just to make it look good. I’m not hacking sites together anymore I’m designing them in Photoshop then bringing them to life. This limited me in what I could do but it also instilled me with the desire to learn more.

Being a 3D artist I feel websites have become too flat. In the early days of slow download speeds flat = fast and it can be an attractive style but now most sites look like they were created with one of those ‘Make a Web Site in 1 hour’programs. Same for the default Bootstrap Nav-Bars, easy to add but not very interesting. And finally, scrolling. scrolling is a useful navigation tool in some instances but in general its annoying and not necessary. Website development has come a long way in the past five years yet website design doesn’t seem to have kept up (of course this is a generalization and there are exceptions).

This week I’m ready to start a new web page project but I want to use mostly Flex in the layout and that means I have to learn a bit more. I’m going to finish the Flex Zombies course first (see below) before building my next site. Here’s a list of the three sites I’ll be visiting on a regular basis this week.

Free Code Camp I’m working through the Front-End Developer program. I’ve completed the HTML, CSS, Bootstrap, and JQuery portions and I’m half way through the JavaScript section. I like code camp. It’s easy to navigate and you actually have to type the code. For me, having to repeatedly type the same commands gets tedious but it does burn it into your memory. The map display is also a great feature. It indicates what stage you’re at but also allows you to review past questions.

Dave Geddes Blog This is a great site I discovered listening to the JavaScript Jabbers podcast. Dave Geddes’ blog focuses on UI and Flex/CSS grids in particular. He’s created a FREE interactive course on Flexbox called Flexbox Zombies. Designed to help you learn Flexbox commands in a fun and enjoyable manner. I’m currently 60% of the way through the course and I do find my retention factor is high. I also like the artwork though the dialogue is a little… boring.. sorry Dave.

And, finally, w3schools. While its layed out as a course I prefer to think of it as teaching me what’s possible. I can’t remember every CSS and HTML command but as long as I know its possible I can look it up.

That’s it for this week. As always comments are welcome .


Leave a Reply

Your email address will not be published. Required fields are marked *