DEV Community

Cent
Cent

Posted on

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>
Enter fullscreen mode Exit fullscreen mode

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>
Enter fullscreen mode Exit fullscreen mode

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!

Sentry image

Hands-on debugging session: instrument, monitor, and fix

Join Lazar for a hands-on session where you’ll build it, break it, debug it, and fix it. You’ll set up Sentry, track errors, use Session Replay and Tracing, and leverage some good ol’ AI to find and fix issues fast.

RSVP here →

Top comments (0)

Sentry image

See why 4M developers consider Sentry, “not bad.”

Fixing code doesn’t have to be the worst part of your day. Learn how Sentry can help.

Learn more

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay