Cent's Two Cents - Project

Hello everyone!

Cent here with the next installment.

Today I did my first project with the Odin Project! It was a relatively simple once, just focusing on the HTML lessons I've gone over in the previous days. I would've added more style to it, but I tend to think its best to just follow the project requirements. It's a project for HTML lessons not CSS lessons, so I don't want to be super focused on getting a design for this simple project down.

This project was just a simple recipe site, with specific pages for each recipe made. I'll share the code for the index page, which is just a list of recipes, and one of the recipe pages.

The link to the project is here: https://centanomics.github.io/odin-recipies/

index.html

<h1>Odin Recipes</h1>
<ul>
  <li>
    <a href="./recipes/rice-bowl.html">Rice Bowl</a>
  </li>
  <li>
    <a href="./recipes/mac-n-cheese.html">Mac and Cheese</a>
  </li>
  <li>
    <a href="./recipes/pbnj.html">Peanut Butter and Jelly Sandwich</a>
  </li>
</ul>

Simple enough, right? Now let's look at the rice bowl recipe page.

<h1>Cent's Rice Bowl</h1>
<img src="https://theviewfromgreatisland.com/wp-content/uploads/2020/04/korean-beef-rice-bowl-8506495-April-24-2020.jpg" alt="Rice bowl with rice, green beans, ground beef, and an over easy egg"/>
<h2>Description</h2>
<p>Cent's rice bowl is a cheap and easy meal that you can customize to your liking. It will usually contain rice, some form of meat, and some form of vegetables</p>
<h2>Ingredients</h2>
<ul>
  <li>Rice</li>
  <li>Ground pork</li>
  <li>Mixed Vegetables</li>
  <li>Your favorite blend of spices</li>
  <li>Cheese (optional)</li>
</ul>
<h2>Steps</h2>
<ol>
  <li>Put one serving of rice into a rice cooker</li>
  <li>While the rice is cooking start browing the ground pork, mixing in the spices while the ground pork is cooking</li>
  <li>Once the ground pork is close to done you can heat up the mixed vegetables in the microwave</li>
  <li>Once the rice is done, add your ground pork and mixed vegetables and mix it all together</li>
  <li>If you want you can add cheese as well</li>
</ol>

Just a few lists and an image for the related food item. As I mentioned, simple, stuff I already know. However, I want to do everything again, and the practice won't hurt.

Today was a bit of a shorter day as finishing the project was a good stopping point for me. Tomorrow we'll start on the CSS lessons!

Until tomorrow!

Blog

Cent's Two Cents - Project

Cent

Join Our Newsletter. No Spam, Only the good stuff.

Related