README.md

Hello new class!

Before you come to your first session at HackYourFuture please go through this document, read, watch and check if you are ready to start your HackYourFuture adventure!

In week one we will discuss the following topics
 • The division of labor between HTML and CSS
 • Introduction to HTML:
    • Parents, children, attributes
    • Indentation
    • Semantic elements
    • Paragraphs, links, images, lists
 • Introduction to ARIA:
    • What is ARIA and why is it important?
    • Using ARIA in HTML
    • Validating ARIA
 • Introduction to CSS:
    • Where can we write it and what difference does that make?
    • Selectors (id, class, element type), properties
    • How to structure a CSS file
    • Naming things
 • External files: relative and absolute paths
 • Getting to know your text editor

Read these Chapters from the Front-end Handbook

• What Is a Front-End Developer?
• Part I. The Front-End Practice
• From Part II. read: Self Directed Learning, also read Learn HTML/CSS
• Read lesson 1: building your first web page

After you finish reading ask yourself the following questions:

• What is a Front-End Developer?
• What is A web browser?
• Wat are considered as Front-End Dev Skills?
• What are good references/resources to use to learn on your own? (have you bookmarked them??)
• What is the difference between HTML and CSS?
• What are HTML elements, tags, and attributes?
• How do you setup up the structure of your first web page?
• What are CSS selectors, properties, and values?
• How do you work with CSS selectors?
• How do you reference CSS in your HTML?
• Why would you use CSS resets?

Watch these videos:

• How the Internet Works in 5 Minutes
• How Web Browsers Work

Get familiar with Accessible Rich Internet Applications (ARIA)

• What is ARIA and why is it important?
• Introduction to ARIA
• Web applications and ARIA FAQ
• Bonus knowlegde: Practical guide for developers on how to add accessibility information to HTML elements using the ARIA specification

Don't worry if you don't understand everything, but make sure to prepare some questions for your first session about the reading material.

Add a card in Trello:

• In Trello, create a card with your name (there is an example in there) and add the link to your CodePen that contains you application assignment.

Install the Slack Apps on your:

• Mobile: App store or Google Play
• Desktop: OSX or Windows

Read:

• About Slack: Cheat sheet for basics and shortcuts
• How to format your messages in Slack: Using Slack
• Take the Trello tour

Check double check:

Are you signed up for:

• Slack
• Trello
• Github

Did you do the following?:

• Write "hallo ✋" in Slack?
• Did you add a card to Trello with your name and added the link to your application assignment (CodePen)?
• Did you create a Github account?

If the answer to this is 'no', don't panic, you can always ask help in Slack, but before you do, please first try and see if you can find some information about the above tools yourself (hint: ask Google first).

Do you have Visual studio installed?

• Visual studio

After you installed vscode, also install the following plugins

• Live HTML Previewer

Visual studio is the default text editor we use in the course. We expect you to use this editor through the entire course.

Curriculum

Don't forget to take a look at the HackYourFuture curriculum. Go through it and make sure you have an idea of what you will learn at HackYourFuture 💪