Frontend Mentor - Fylo dark theme landing page solution

This is a solution to the Fylo dark theme landing page challenge on Frontend Mentor. Frontend Mentor challenges help you improve your coding skills by building realistic projects.

Table of contents

• Overview
  • The challenge
  • Screenshot
  • Links
• My process
  • Built with
  • What I learned
  • Continued development
  • Useful resources
• Author
• Acknowledgments

Overview

The challenge

Users 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

Screenshot

Links

• Solution URL: GitHub
• Live Site URL: Live Preview

My process

Built with

• React
• TypeScript
• ESLint
• Prettier
• Vite
• CSS and CSS Modules
• Mobile-first workflow

What I learned

This is my first complete project using React TypeScript. Although this project didn't require using any hooks, routing or state management, I learned a lot about how to structure a React TypeScript project. Overall, a great experience.

Continued development

If you have any suggestions on how I can improve my code, please do let me know! I'll always look forward to learning new things.

Useful resources

• Complete Intro to React v8 and Intermediate React v5 - I learned a lot about React from this course by Brian Holt. I used the same setup for this project. Definitely check it out!

Author

• Website - Doston Nabotov
• Frontend Mentor - @dostonnabotov
• Twitter - @dostonnabotov

Acknowledgments

• Kevin Powell for his amazing contents on CSS