Space Tourism

This app was built as part of a challenge on the website frontendmentor.io.

What is frontendmentor?

Frontend Mentor is a platform that provides real-life web development projects for front-end developers to practice their skills. The projects on Frontend Mentor are designed to challenge developers and help them improve their coding abilities. The platform offers a wide range of projects, from beginner to advanced, and lets you use whatever web development technologies you would like, such as HTML, CSS, JavaScript, and React. Frontend Mentor also provides a community forum where developers can ask for help, share their solutions, and receive feedback from other developers. Whether you're a beginner or an experienced developer, Frontend Mentor is a great place to improve your front-end web development skills.

Why?

My main objective taking this challenge was to get familiar with tailwindcss.

Tailwind CSS is a utility-first CSS framework that enables developers to rapidly build responsive and custom-designed user interfaces. It provides a collection of pre-defined CSS classes that can be used to style HTML elements, without the need to write custom CSS. Tailwind CSS offers a comprehensive set of tools for styling, including layout, typography, colors, and more. With its extensive documentation and flexible customization options, Tailwind CSS is popular among web developers who want to save time and simplify their CSS workflow. It's also compatible with various front-end frameworks like React and Vue. Tailwind CSS allows developers to create complex layouts and designs with ease, making it a valuable tool in the modern web development workflow.

Using tailwindcss in vsCode is a blast. As the autocomplete you get with the Tailwind CSS Intellisense extension is amazing.

Challenges

During the space tourism website project on Frontend Mentor, one of the biggest challenges I faced was dealing with the responsiveness required for the different background images. The website had multiple pages with unique background images, and it was essential to ensure that they were displayed correctly on all screen sizes and devices. This required careful planning and implementation of responsive design techniques such as media queries to adjust the layout and image sizes based on the screen size. It was a time-consuming process that required a good understanding of CSS. Despite these challenges, Tailwind CSS proved to be a useful tool that allowed me to quickly create custom-designed interfaces by applying pre-defined classes to HTML elements, making the development process more efficient.

Conclusion

In conclusion, building the Space Tourism website on Frontend Mentor was a valuable learning experience for me as a front-end developer. The project allowed me to sharpen my skills in tailwindcss, a utility-first CSS framework that is popular among web developers for its ability to rapidly build responsive and custom-designed user interfaces. Using tailwindcss in VS Code was a breeze with the help of the Tailwind CSS Intellisense extension, which provided me with a wealth of helpful autocomplete suggestions. However, as with any development project, there were challenges to overcome. The most significant challenge was ensuring that the website's different background images were displayed correctly across all screen sizes and devices. Nevertheless, with careful planning and the implementation of responsive design techniques, I was able to meet the challenge and complete the project successfully. Overall, Frontend Mentor is an excellent platform for developers looking to practice and improve their front-end web development skills, and I highly recommend it to anyone looking to grow their skills in this field.