Frontend-Fundamentals

course from Pirple.com

---

Homework #1 Lists

What's your favorite food? Do you know how to make it yourself? If not, look up the recipe online. Next, create an HTML document, and within the body of the page, create two lists:

1. The first list should be an unordered list of all the ingredients needed to make the dish.
2. The second list should be an ordered list, detailing the steps you need to take to prepare that dish. Then, add comments to your HTML, to explain the purpose of each section of code that you create.

---

Homework #2 Images

It's time to make your recipe (from homework #1) a little more exciting.

1. Add a title to your page (within the < head >) and an actual < h1 > title on the page.
2. Below the h1, add a paragraph that explains what the food is, and why you like it so much.
3. Somewhere on the page, add a few images of finished versions of your dish so that the reader can see what the final product should look like.
4. Add emojis to your second list (the ordered list), so that at least 5 of the lines end with an emoji character. You can find emojis online pretty easily. If you don't how to use emojis in HTML, read this article. Then use this reference.

---

Homework #3 Links

It's time to compare your recipe to the recipes of others.

1. Find the 5 best recipes for your dish from around the web.
2. Grab the URL for each recipe
3. Add a list to the bottom of your document. Each item in the list should be a link to one of the recipes.

---

Project #1

We didn't cover all the possible HTML tags yet. What are they? And what should they be used for? For this project you should:

1. Find a resource online that gives you a list of each HTML tag that you can use.
2. Pick 5 of those tags (5 that we have not covered so far).
3. Create a simple website about your favorite book / story, and include those 5 tags in the HTML. (The page can have any other tags as well, as long as those 5 are included). This can take any form. You can get as complicated or as simple as you wish.
4. Add comments to each section of your code, explaining the purpose of that block.

For extra credit, use one or more of these tags (if you haven't already):

1. < video>
2. < audio>
3. < form>
4. < select>
5. < input>
6. < base>
7. < meta>
8. < iframe>