@dev-jLagunasSubmitted 10 months ago
PROJECT OVERVIEW: This project was created using HTML, SCSS, Tailwind CSS, Typescript, and Vite as the build tool.
MAIN FOCUS: I aimed to write easily understandable HTML, SCSS, and Typescript code, adhering to best practices. Additionally, it served as a refresher project for me to reacquaint myself with Tailwind CSS.
PERSONAL CHALLENGE: I incorporated two extra features to challenge myself: a navbar that fades out on scroll and multi-language (English, Spanish, Japanese) toggle functionality.
Overall Thoughts: While I still enjoy working with Tailwind, my improved proficiency in CSS/SCSS has made me find the latter more intuitive. Nevertheless, Tailwind remains a fantastic tool.
WHAT I LEARNED: I gained a deeper appreciation for Vite's utility. With minimal configuration, I seamlessly integrated SCSS, Tailwind, and Typescript. I also encountered a bug related to Vite's use of absolute paths for images, necessitating post-deployment adjustments to file paths in the background-image: url() properties.
STRUGGLED WITH: Creating the translation-data.js file posed a challenge. Initially, I used IDs for all elements, but later realized it would be more effective to work with data- attributes.
FINAL THOUGHTS: I grappled with the decision of whether to proceed methodically to minimize refactoring or to work swiftly to build out the project and then dedicate more time to refactoring. It's a consideration for enhancing my speed and efficiency.
Thank you for visiting my site. Until next time.
~Juan
