ZC

Building a Real Site for a Real Client. Using Next.js and Sanity

July 1, 2025

Building a website for Bunkers Bar and Grill was an exciting and enriching experience. It allowed me to support a local business while exploring a modern tech stack tailored for scalability, ease of deployment, and effortless content management.

#Identifying the Opportunity

Bunkers Bar and Grill, a popular local spot at our community clubhouse, has been serving customers for over two years. Despite their local success, they lacked a solid online presence. This gap meant customers struggled to find up-to-date information on menus, events, and hours. Recognizing this, I approached the owners about creating a custom website to boost their visibility and operational efficiency. Enthusiastically, they agreed, and I immediately began planning.

#Goals for the Project

My primary objectives for this website were:

  • Easy deployment and maintenance
  • Scalability for future growth
  • Cost-effectiveness
  • User-friendly content management for non-developers

#Choosing the Tech Stack

After extensive research and inspiration from developers like Theo Browne, I finalized the following modern tech stack:

  • Framework: Next.js – Chosen for robust performance, excellent developer experience, and seamless integration with modern web technologies.
  • Deployment Platform: Vercel – Selected for its simplicity in deploying Next.js applications and outstanding performance.
  • CMS: Sanity.io – A powerful, flexible content management system that integrates seamlessly with Next.js via the Next Sanity library.
  • Styling: Tailwind CSS – My preferred utility-first CSS framework for rapid, consistent styling.
  • Component Library: ShadCN UI – Provided customizable components, speeding up development and ensuring UI consistency.

#Development Process

Initially, I built a simple prototype within a week to demonstrate the potential of the website and gather feedback. During a follow-up meeting, the Bunkers team was impressed and provided valuable insights to enhance the user experience. Incorporating their suggestions, we finalized the plan and officially started the full development.

#Empowering with Sanity.io

Integrating Sanity.io was particularly rewarding as it enabled the bar owners to independently manage website content. Embedding Sanity Studio directly within the Next.js app simplified content management, significantly reducing the need for developer intervention and ensuring sustainability.

#Seamless Deployment with Vercel

Deploying the website on Vercel was effortless, allowing quick iterations and seamless updates. This flexibility ensures the site can grow effortlessly alongside Bunkers Bar and Grill.

#Key Learnings

This project provided an excellent opportunity to explore modern web development and technologies, such as responsive design, modular UI components, and effective use of color themes. I learned how to:

  • Create visually appealing sites optimized across various screen sizes.
  • Abstract UI components into reusable, modular pieces.
  • Build consistent, declarative UIs efficiently.

#Final Thoughts

Overall, this project reinforced my skills in Next.js, Sanity.io, and modern web development practices while benefiting a local business. It's gratifying to leverage technology to directly support and enhance community businesses, creating tangible, lasting impacts. I'm proud of the result and excited to showcase this project in my portfolio.

#References