This module has been reorganised:
Welcome to the wonderful world of web development! In this module you will learn the basic building blocks of the web: HTML and CSS. HTML gives us the power to add text, images and videos to a page. CSS gives us the power to organize these parts and make it look nice.
The products of HTML and CSS comprise a two-thirds of what is called frontend
(the final third is client-side JavaScript, which you will learn about in later modules). What is frontend? It's another word for the presentational part of a piece of software. In terms of web development we're talking about "what you see" when you go to any website.
Think of it like this: if a webpage were a person, the HTML would be the skeleton and CSS the skin and clothing!
You'll also be learning GIT, software that will allow you to save your folders and files in case they accidentally get deleted or end up corrupt. It can do much more and you'll learn all about that starting from week 2!
In order to successfully complete this module you will need to master the following:
HTML
and CSS
responsive
web developmentcommand line interface (CLI)
GIT
and its basic usageTrello
and GitHub
as a way to submit your homeworkVisual Studio Code
browser's inspector
Before you do anything, first go here.
This repository consists of 3 essential parts:
README
: this document contains all the required theory you need to understand while working on the homework. It contains not only the right resources to learn about the concepts, but also lectures done by HackYourFuture teachers. This is the first thing you should start with every weekMAKEME
: this document contains the instructions for each week's homework. Start with the exercises rather quickly, so that you can ground the concepts you read about earlier.LESSONPLAN
: this document is meant for teachers as a reference. However, as a student don't be shy to take a look at it as well!Let's say you are just starting out with HackYourFuture. This is what you do...
README.md
for that week. For the first week of HTML-CSS
, that would be Week1 ReadingMAKEME.md
. For the first week of HTML-CSS
, that would be Week1 HomeworkIn summary:
To have a more detailed overview of the guidelines, please read this document or ask your mentor/class on Slack!
For each module HackYourFuture provides you with video lectures. These are made by experienced software developers who know what they're talking about. The main teacher for this module will be Arco Mul: an experienced video game and web developer!
You can find out more about him here:
Learn from Arco in the following playlist of videos he has made for you! (Click on the image to open the link)
Week | Topic | Reading Materials | Homework | Lesson Plan |
---|---|---|---|---|
0. | Quick Start! | W0 Reading | - | - |
1. | Command Line Interface basics, HTML/CSS syntax | W1 Reading | W1 Homework | W1 Lesson Plan |
2. | Introduction to GIT, Responsive design | W2 Reading | W2 Homework | W2 Lesson Plan |
3. | GIT branches, CSS frameworks, Working with the browser | W3 Reading | W3 Homework | W3 Lesson Plan |
Have you finished the module? Great! Pat yourself on the back for the great work you've done.
If you feel ready for the next challenge, click here to go to JavaScript!
The HackYourFuture curriculum is subject to CC BY copyright. This means you can freely use our materials, but just make sure to give us credit for it :)