Stop Just Watching, Start Building: My Weekly Progress Report 🚀

Kenny — Wed, 13 May 2026 20:02:35 +0000

They say the best way to learn is to do. While I'm halfway through my HTML & CSS course, I decided to stop just 'coding along' with the instructor and start building something that actually matters to me. Last week, I started building Kay Crochets, a landing page for my creative business, built entirely from scratch.

The Power of Semantic HTML
I didn't just use <div> for everything. I wanted this site to be accessible and SEO-friendly. I used:
<header> for my navigation.
<main> to wrap my core content.
<figure> and <figcaption> for my product cards.
The reason for this is that coding with meaning makes the CSS much easier to target later

<body>
    <div class="container">
      <header>
        <nav> ... </nav>
      </header>

      <main>
        <section class="main-article">
          <div class="hero-text">
            <h1>Kay Crochet</h1>
            <p> ... </p>
            <a href="#" class="btn hero-link">Customised Order</a>
          </div>
          <img src="images/img1-BR.png" />
        </section>

        <section class="tutorials">
          <div class="tutorial-container">
            <div class="tutorial-box">
              <figure>
                <img src="images/sunflower.png" alt="sunflower bouquet" />
                <figcaption>Sunflower Bouquet</figcaption>
                <a href="#" class="btn tutorial-link">youtube tutorial</a>
              </figure>
            </div>
            </div>
        </section>
      </main>
    </div>
</body>

My "Aha!" Moment with CSS Grid
I used to fear layouts, but last week, CSS Grid became my best friend.
For my tutorials section, I used:

.tutorial-container {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  column-gap: 40px;
}

Seeing four perfectly aligned cards snap into place was the most satisfying moment of my journey so far.

Styling for the right vibe
A good designer/developer knows that presentation matters. I chose a colour palette that feels warm and premium:
Background: #f3e8e9 (a soft, clean neutral).
Accents: #6f111b (a bold red).
Typography: A mix of Merriweather for headings (elegance) and Inter for UI (clarity). I even experimented with SVGs for custom icons to give the bestseller section that extra sparkle.

The Struggle of the Week
I spent way too much time trying to keep my images from stretching. I finally discovered aspect-ratio: 1/1 and object-fit: cover. It’s a small CSS property, but it made my images look professional and consistent.

The Growth Mindset: I’m adding to this site every day as I learn new lectures. This week, my goal is to make this layout Responsive so it looks just as good on a phone as it does on my MacBook.

What project are you currently building to test your skills? Share your links below. Also, I’m very open to feedback; if you see anything in my snippets that could be optimized or handled better, I’d love to hear your critiques. Let’s grow together 🚀

From Procrastination to Progress: 4 Years to Finally "Get" Web Development

Kenny — Sat, 09 May 2026 19:30:57 +0000

I first started web development in 2022. Fresh out of university, surrounded by developers, I had every resource at my fingertips, but somehow, I didn't grasp the whole point of it. I started courses, both paid and free, and joined programs like ALX, but did not finish.
Fast forward to today: I am finally transitioning fully into Frontend. It wasn't a sudden spark of genius, it was a change in strategy. If you’ve been 'starting' for years like I was, here is what I finally had to learn to move forward:

1. Start at the Very Beginning:
Don't just jump into code. I realised I was trying to speak a language before I knew what a sentence was. Take the time to learn how the web actually works... DNS, hosting, browsers, and familiarise yourself with the basic terminology. If you don't understand the why, the how will always feel like a chore. Don't just jump into HTML & CSS.

2. Kill the "Jumping Around Courses" Habit:
I used to jump from a free YouTube tutorial to a paid course to a bootcamp without ever finishing one. Pick one and see it through. I’m currently halfway through Jonas Schmedtmann’s HTML/CSS course on Udemy, and the difference is that this time, I’m not looking for the 'next' thing. I’m mastering the current thing.

3. Depth Over Speed (No Multitasking):
It’s tempting to try to learn HTML, CSS, JavaScript, and React all at once. Don’t. Take it one bit at a time. Make sure you truly understand how a CSS Grid works before you rush into a JavaScript framework. Build the foundation first, or else the house will collapse.

4. Practice! Practice! Practice!!!
Coding along with a video is passive learning. It feels good, but you aren't building muscle memory. Build something from scratch and add to it as you learn. I make sure to build things from scratch. If I learn a new navigation bar trick, I try to recreate it without the video. Practice until the syntax becomes a second language.

5. Start building a portfolio early.
Document the Messy Middle. I wish I had started my portfolio in 2022. Don't wait until you are an expert to show your work. Save your screenshots, keep your messy code snippets, and write about your journey. It’s your story; OWN IT! This post is me finally doing exactly that.

My journey from 2022 to now hasn't been a straight line, but it’s my line. To anyone else currently in the procrastination loop, it’s okay to start over... as long as you start differently this time.

What’s one thing that stopped you from finishing your first coding course? Let’s talk in the comments.

DEV Community: Kenny

Stop Just Watching, Start Building: My Weekly Progress Report 🚀

From Procrastination to Progress: 4 Years to Finally "Get" Web Development