Elina Shelest

2024

Tours In Space

Type
Experimental

The project was created as a part of a Front End Mentor challenge. The goal was to create a multipage website with custom slider animation and responsive design.

After working so long with React, I decided to tackle this site using pure JavaScript andjust HTML & CSS.
I wanted to challenge myself and build simple pages from scratch without using any libraries.

Development

The challenge to myself was to develop this website fast and apply all the knowledge I have gained over the years. I wanted the code to be as clean and as precise as possible. I started by working on page by page, creating the basic structure and then adding the styles.

I am used to working with apps and websites that have a lot of functionality and logic, so this was a nice change of pace.

Challenges

The biggest challenge was to create the smooth slider animation with just CSS and JavaScript and no libraries. After that my other challenge was to make the site pixel perfect according to the design. There were a lot of elements that needed to be positioned just right and I had to use a lot of CSS tricks to make it work.

I also had to make sure that the site is responsive and works on all devices. I used media queries to make sure that the site looks good and works on tablet and smartphones since most of the websites now are viewed on mobile devices first.

Conclusion

Overall it was a nice and quick exercise to build a simple multi-page website without blows and whistles but with perfect HTML, CSS and JavaScript. I am happy with the result and there is a potential to optimize it and turn into web app with more functionality if the need arises.