Week 2: Revising HTML & CSS Fundamentals Through Hands-On Practice Projects
Hi, I’m Deepika 👋 I’m a 3rd year B.Tech Information Technology student and an aspiring Full-Stack Developer with a strong interest in building clean, user-friendly web applications. I enjoy working with React, Flask, Firebase, and SQLite, and I’m currently focused on strengthening my frontend fundamentals through a 3-month sprint covering HTML, CSS, Tailwind CSS, and responsive UI design. I write about my learning journey, frontend concepts, and small projects here on Hashnode. I also share my source code and daily practice on GitHub as part of my #BuildInPublic approach. I’m open to internships, collaborations, and learning opportunities. Let’s connect and grow together 🚀
In Week 2 of my frontend learning journey, I focused on revising core HTML and CSS concepts by building small practice websites. After working with frontend technologies earlier and taking a short gap, my goal is to rebuild strong fundamentals through hands-on learning.
This article covers what I built, what I learned, and how practicing small projects helped me understand frontend basics better.
📚 Concepts I Learned This Week
During this week, I focused on the following CSS concepts:
Flexbox for layout structure
align-itemsfor vertical alignmentBox-shadow to add depth to elements
Background images for page styling
Border-radius for smoother UI elements
Using GIF images in webpages
Linking and organizing external CSS files
🛠️ Projects I Worked On
1️⃣ Birthday Website
What I built:
A simple birthday-themed webpage with images and custom styling.
What I practiced:
Flexbox for layout
Background images
Border-radius for elements
Box-shadow for visual depth
Using GIF images
2️⃣ Lab Equipments Page
What I built:
A webpage that displays lab equipment information using structured HTML and CSS.
What I practiced:
Clean layout using Flexbox
Proper spacing with margin and padding
align-items for alignment consistency
3️⃣ Space Exploration Website
What I built:
A themed website related to space exploration.
What I practiced:
Background images
Image placement and scaling
Section-based layout structure
Clean and minimal UI styling
4️⃣ HTML Tables Practice
What I practiced:
Creating tables using
<table>,<tr>,<th>, and<td>Applying basic CSS styling to tables
🧠 What I Learned From This Week
Flexbox makes layout alignment much easier
Small CSS properties like shadow and border-radius improve UI feel
Practicing basics builds confidence for advanced frameworks
Building small projects is the best way to revise fundamentals
📂 How I Document My Learning
I organize my work week-wise in VS Code and push all practice code to GitHub.
I also write weekly learning summaries on Hashnode as part of my learning in public journey.
🚀 What’s Next
In the coming weeks, I’ll continue by:
Practicing responsive design
Learning Tailwind CSS
Building more structured UI layouts
Final Thoughts
Week 2 helped me regain confidence in HTML and CSS fundamentals. Revisiting these concepts through small projects made them more practical and easier to understand.
