Skip to content

MAKEME.md

Latest commit

 

History

History
82 lines (53 loc) · 3.84 KB

MAKEME.md

File metadata and controls

82 lines (53 loc) · 3.84 KB

Homework HTML/CSS Week 1

Todo list

  1. Prep exercises
  2. Command Line Interface
  3. CSS Challenges
  4. Code along
  5. PROJECT: Digital Resume

1. Prep exercises

Prep exercises are exercises that you should work on before the session on Sunday. These are a little more difficult or show an important concept and as such are a great exercise to talk about with your mentor. Have a solution ready by Sunday as you may be asked to show what you did.

Inside your HTML-CSS fork, go to the folder week1. Inside of that folder, navigate to /prep-exercises. For each exercise, you will find a separate folder. The README explains what needs to be done. There will also be some questions at the bottom to think about. Go through them before the session on Sunday as it will be covered then.

2. Command Line Interface challenge

Before you start any of the exercises, make sure to create a folder on your desktop that will hold all of your exercise files. Give the folder the name hyf-html-exercises. Inside, create a week1 folder and will hold this week's exercise files inside.

Using the CLI, create a plain text file (.txt) that contains the commands necessary to answer the following questions:

  1. How do I create a hidden file or folder? How do I display it in the CLI?
  2. How do I create multiple nested directories, like /c/Users/myusername/these/folders/are/just/for/fun?
  3. How do I append a message to a file, without a newline character, so the output would be:
first message
second message

3. CSS Challenges

In order to improve you need to practice a lot! In the following challenges you'll work with CSS, starting from the absolute basics to building a page:

4. Code along

A big part of learning web development is through learning by example. In the following video you'll learn how to build a simple website, using basic HTML & CSS:

5. PROJECT: Digital Resume

Every week ends with a project you have to build on your own. Instead of getting clear-cut instructions, you'll get a list of criteria that your project needs to measure up to.

In the following assignment you'll make your own Digital Resume. Here are the requirements that need to be fulfilled:

  • It needs to be one webpage
  • Your project folder should contain two files: a .html and a .css file
  • Include the following pieces of information:
    • Your personal information (Note: the page will be public on the whole internet for our review, so as a privacy-conscious individual, feel free to use fake information here)
    • A picture of you
    • A few lines about who you are
    • Education (list at least 1 education institute)
    • Work experience (list at least 1 workplace)

When writing the HTML include the following:

  • Different types of headings, like <h1> and <h2>
  • An unordered list (<ul>). Use this to list out your educational background
  • Another unordered list (<ul>).
  • An <img> tag (for your picture)
  • Some <p> tags

When writing the CSS include the following:

  • Some CSS properties, like: margin, padding, color, etc.
  • You are NOT allowed to use CSS frameworks (like Bootstrap, MaterializeCSS, etc.)
  • Bonus: look into using flexbox or grid

SUBMIT YOUR HOMEWORK!

After you've finished your todo list it's time to show us what you got! The homework that needs to be submitted is the following:

  1. The CLI challenge
  2. The Digital Resume

Upload both in a repository to GitHub and then upload the link to it on the Trello board: "Feedback Assignments". Go through the guide to learn how to do this.

Deadline Tuesday 23.59 CET