FORTHEFELLOFIT Website
This project is a personal blog, created to document and share my adventures in the great outdoors. My goal was to design something modern, minimal, and smooth to navigate, while still capturing the atmosphere and aesthetic of the outdoors.
Problems Faced
Deciding on a format to store and manage content files.
Displaying map with pin icon for each walk location.
Choices Made
I chose Next.js for its hybrid rendering capabilities and great developer experience. Tailwind allowed me to rapidly iterate while keeping the styling consistent.
I chose to use Next.js dynamic routing for this project, which led me to explore different CMS options. After some research, I found that MDX files were a great fit for this type of site. With dynamic routing, I could use the slug of each content page to retrieve and render the corresponding MDX file.
I used an MDX file to store key information and details about each walk, which I accessed through frontmatter. This setup allowed me to render a map and use the startLat and startLng properties to place a marker at the starting point of each walk.
Outcome
The final site is lightweight, responsive, and feels smooth to interact with. It has already helped me showcase my skills to potential clients and employers, and acts as a foundation I can expand over time.