Quality code

While this is a relatively small project, I still tried to ensure that the basic HTML for the page follows best semantic practices and norms.

The BEM (Block-Element-Modifier) naming system and the organization of files into base and layout files, components and mixins ensures that the project is extensible and can be easily extended by another developer.

1 about
Project’s file organization in the Atom editor on macOS

The use of SASS along with gulp.js greatly increases productivity and allows for the use of mixins, functions and includes. The folder structure follows the commonly known 7-1 pattern and all the elements are divided into modules for greater versatility.

In general, I always try to future-proof my code, because no one likes to work with rigid, messy and error-prone code.

The Implementation

Preview.everlydesigns.co.uk homestead (1)

Beautifully responsive

All my websites follow the mobile-first approach to web development. That means, I start styling the elements for mobile devices first and add more code as the viewport gets wider.

2 responisve
Screenshots of the front page portraying site’s responsiveness

Want to inspect the code?

If you’re interested in this project further, make sure to check out the GitHub repository below. I made this project temporarily public so you can preview any aspect of my code and see if I’d be a good fit for your company:

Get in touch

I hope you enjoyed this case study and revisiting this chapter with me. If you like what you see here and want to get in touch, I’d love to hear from you.