L&M Auto Center Website Revamp: From Outdated HTML to Modern Next.js

Skip to TLDR ↓

Background

L&M Auto Center is a family-owned auto repair shop that has been serving the local community for over 40 years. While they had a loyal customer base, their outdated single-page HTML website, which was over a decade old, was not effectively attracting new customers or showcasing their services.

Challenges

  • The old website was not mobile-friendly and had a poor user experience

  • The design was outdated and did not reflect the professionalism and quality of L&M's services

  • Contact form was not working and led to possible clients loss

  • The website was not optimized for search engines, limiting its visibility to potential new customers

  • The single HTML page made it difficult to organize content and add new information over time

    Old website screenshot

Solution

Building a new website from scratch was the best way to address these issues. Next.js & Tailwind CSS were used to create a modern, responsive, and efficient platform. The new site features:

  • Server-side rendering (SSR) with Next.js for fast initial page loads and improved SEO
  • Lazy loading of images and non-critical resources to reduce page load times
  • Integration with Vercel for seamless Git-based deployments and development previews
  • Responsive design that adapts to any device
  • Technical SEO improvements to enhance search engine visibility
  • Structured data for Google Rich Snippets and SEO
  • Modern visual presentation that reflects the quality of service L & M provides to their community
  • Lighthouse score of over 95 for performance, accessibility, best practices, and SEO

Technical challenges

Gallery page full of images, that are not optimized for web and takes a long time to load. With Next.js Image component, I was able to optimize images and improve load times. And achieved 95% score on Lighthouse.

Results

The new website I developed and launched for L&M Auto Center has delivered significant results for their business:

  • 50% increase in website traffic within the first month
  • over 10 contact form submissions every week
  • 95% score on Lighthouse
  • Higher search engine rankings for key terms like "auto repair near me" and "oil change Lincroft NJ"
  • Positive feedback from customers on the improved user experience and design
New website screenshot

TLDR

Revamped website for L & M Auto Center, a local automotive repair shop, to meet modern customer expectations.

  • Next.js 15 (App Router) & TailwindCSS
  • Implemented SSG, image optimization, and route prefetching
  • Converted single page structure to multi-page structure for better SEO
  • Improved Lighthouse scores from ~45 to 95+
  • Enhanced mobile responsiveness and SEO
  • Increased traffic from 20-30 visitors per day to 80-100 visitors per day
  • Increased use of contact form
Lighthouse score

Conclusion

As a freelance developer, my goal is always to provide my clients with modern, performant web solutions that meet their unique business needs. For L&M Auto Center, I was able to utilize my expertise in Next.js and web optimization to deliver a completely revamped website that greatly enhanced their online presence and drove measurable improvements in customer engagement and search visibility. This project showcases my ability to work independently with clients, assess their requirements, and implement a tailored technical solution that achieves real results. By combining my specialized skillset in React and Next.js with a strong focus on performance, SEO, and maintainability, I was able to provide L&M Auto Center with a website that will serve as a valuable asset in their continued growth and success.