Playing With Matches
At the base you have your HTML. It’s the structured content of the page: headings, paragraphs, images, videos.
On top of that you have your CSS. This handles the presentation: colours, fonts, layout. Note that it’s a separate layer: see, there’s a line there and everything. It exists apart from the structure and content (the HTML) of the page.
Local set up
You should have a projects folder in your home directory. It’s good practice to create all your different projects in one place on your PC so that you can find them easily.
In your projects folder:
- create a folder called Playing-With-Matches;
- change into the folder Playing-With-Matches from the terminal using
- initialize it as a git repository using
As you do each task create the files in the Playing-With-Matches folder.
After each task remember to commit your changes using git.
We’re going to build up a page that shows a series of random numbers, checks for matches, and shows a message. The end result will look like this:
Work your way through the 10 steps, starting with Show a number.