Welcome to Codewell! 👋

Codewell's aim is to provide you with real-world design templates that you can use to practice your HTML and CSS projects.

Free or paid, all templates are high quality and will make great portfolio pieces.

This is my solution to the codewell Javascript30 challenge.

Table of contents

• Welcome to Codewell! 👋
  • Table of contents
  • Overview
    • The challenge
    • Links
    • Built with
    • My approach
      • Future development
    • Wes Bos's Javascript30

Overview

The challenge

The challenge is make a responsive navbar similar to this:

My solution to the challenge in mobile, tablet and desktop (1440px)

Links

• Solution URL: here

Built with

• Semantic HTML5 markup
• SASS for CSS
• Flexbox
• CSS Grid

My approach

The first thing was to design my sass reusable components and a sass file structure. After that I would nest styles inside each other. I did the body and then the navbar then finished with the main section. The main and navbar are their own sass css components.

Future development

I would like to do more of sass and use more functionilities including mixins, functions and some other crazy stuff. Being the first time using sass, it was quite an uphill to learn how to leverage the power of sass.

Wes Bos's Javascript30

This challenge is best coupled with Day 22 of Wes Bos's Javascript30 course.