🚀 Week 8 of #100DaysOfCode: A Week of Building, Learning, and Growing!
Alabi Temitope
Posted on November 27, 2024
This week has been a rewarding journey filled with accessibility, CSS mastery, and JavaScript challenges. Here's a detailed recap of my progress:
🏠 Day 51 & 52: Building an Accessible Homepage
This was all about inclusivity! Using semantic HTML, I built a homepage that emphasizes proper links, labels, alt text, and headings. Accessibility is a crucial aspect of web development, and ensuring usability for everyone is incredibly satisfying.
🤝 Day 53: Crafting a User-Friendly Contact Page
Continuing my focus on accessibility, I built a contact page and reviewed everything I’ve learned this week. Reviewing and revisiting concepts solidifies knowledge and ensures steady growth.
🎨 Day 54: Kicking Off a Neat NFT Site
I delved deeper into CSS to create a visually stunning NFT site. Here's what I learned:
- CSS organization for better readability
- Structuring content containers
- Designing full-width backgrounds
- Handling tricky margin quirks
Although challenging, these techniques helped me design a polished layout!
✨ Day 55: Finishing the NFT Site with CSS Animations
To elevate the user experience, I incorporated advanced CSS animations for smooth interactivity. It was thrilling to see the design come alive!
📐 Day 56: Exploring CSS Positioning
This day was all about positioning and layout mastery. I learned:
- Using
margin: auto
to center flex children - Differences between
position: relative
andposition: absolute
- Fixing unwanted bottom image spacing with
img { display: block; }
- Layering elements effectively using
z-index
These concepts came together as I built a co-working space site that balanced creativity and functionality.
🍪 Day 57: Tackling JavaScript with Cookies
I built “the world’s most annoying cookie consent” with Scrimba’s JavaScript Module 6. This hands-on project taught me:
- Using
setTimeout
for delayed actions - Form validation with
event.preventDefault()
- Styling dynamically with
classList.toggle
- The power of
element.style
for inline styling
🌟 What’s Next?
I’m thrilled with the progress I’ve made so far. Each day is a step closer to mastering web development!
📌 Follow My Journey:
- GitHub Projects: 100 Days of Code Repository
- Medium: Toptech on Medium
- X (formerly Twitter): @Toptech5419
Week 8 was a mix of challenges, creativity, and learning. I can’t wait to see what Week 9 has in store! 🚀
WebDevelopment #100DaysOfCode #CSS #JavaScript #Accessibility
Posted on November 27, 2024
Join Our Newsletter. No Spam, Only the good stuff.
Sign up to receive the latest update from our blog.