Fylo Landing Page

Date: August 22, 2023

Coded In: HTML | CSS

Resourses Used: W3C Schools: HTML List | MDN: Form Validation

View: Live Site | Code

The Goal

My Goal with this project was to challenge myself to complete an entire landing page and get it as close to the jpg designs, from frontend mentor, as possible. User should be able to:
-View the optimal layout for the site depending on their device's screen size
-See hover states for all interactive elements on the page

The Process

During this project I marked up the jpg design files that were provided by Frontend Mentor. I used a mobile first approch when working on this project. I found certain aspects of this project to be quite challenge. One challenge inparticular was working on the form validation and hover states. These challenges drove me to ask questions. While building out the forms for this project I wanted to take a deep dive into form validation. I used MDN to learn more about form validation and I look forward to diving deeper on this topic in the future.

The Outcome

With this project I was able to get the finised results close to the desing but not as close as I would have liked it to be. you can check out this solution on Frontend Mentor.

What I Learned

This project tuaght me alot of unexpected lessons, I learned more about flex box and I learned alot about forms and for validation. I also went back to the basics and reseached the nav, ol/ul, li and a elements. This project was more about learning and growth rather then perfection.

Future Focus

I Plan to continue working on Junior Frontend Mentor Projects and work my way up to intermediate. I will also be starting a Javascript course soon to start incorporating javascript into my projects.