<?xml version="1.0" encoding="UTF-8"?><rss xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:content="http://purl.org/rss/1.0/modules/content/" xmlns:atom="http://www.w3.org/2005/Atom" version="2.0"><channel><title><![CDATA[Sanjiv Sutar's Engineering Notes]]></title><description><![CDATA[Notes on frontend architecture, React, Next.js, Node.js and AI-assisted engineering, from an Engineering Manager with 15+ years of experience. Case studies, les]]></description><link>https://sanjivsutar.hashnode.dev</link><image><url>https://cdn.hashnode.com/res/hashnode/image/upload/v1593680282896/kNC7E8IR4.png</url><title>Sanjiv Sutar&apos;s Engineering Notes</title><link>https://sanjivsutar.hashnode.dev</link></image><generator>RSS for Node</generator><lastBuildDate>Wed, 14 Oct 2026 18:35:16 GMT</lastBuildDate><atom:link href="https://sanjivsutar.hashnode.dev/rss.xml" rel="self" type="application/rss+xml"/><language><![CDATA[en]]></language><ttl>60</ttl><item><title><![CDATA[Rebuilding an Enterprise Automotive Platform from .NET to Next.js, in One Switch]]></title><description><![CDATA[The starting point
The platform was a large, public-facing automotive website with a booking flow, calculators and a dealer-search tool. It was built on .NET and C#, and it had the problems that show ]]></description><link>https://sanjivsutar.hashnode.dev/rebuilding-an-enterprise-automotive-platform-from-net-to-next-js-in-one-switch</link><guid isPermaLink="true">https://sanjivsutar.hashnode.dev/rebuilding-an-enterprise-automotive-platform-from-net-to-next-js-in-one-switch</guid><category><![CDATA[Next.js]]></category><category><![CDATA[TypeScript]]></category><category><![CDATA[Node.js]]></category><category><![CDATA[GSAP]]></category><category><![CDATA[videos]]></category><category><![CDATA[Video.js]]></category><category><![CDATA[SEO]]></category><dc:creator><![CDATA[sanjiv sutar]]></dc:creator><pubDate>Tue, 13 Oct 2026 17:54:27 GMT</pubDate><enclosure url="https://cdn.hashnode.com/uploads/covers/6acd515a264cb99467b2713e/7ac8652b-1b22-4eb0-9629-92ecacabc892.png" length="0" type="image/jpeg"/><content:encoded><![CDATA[<h2>The starting point</h2>
<p>The platform was a large, public-facing automotive website with a booking flow, calculators and a dealer-search tool. It was built on .NET and C#, and it had the problems that show up in older enterprise sites: pages were slow, builds and releases took a long time, and the code was hard to change and hard to hire for. Every small change cost more than it should have.</p>
<h2>The decision</h2>
<p>We rebuilt the frontend on Next.js 13 with a Node.js layer. The reasons were practical:</p>
<ul>
<li><p><strong>Faster pages and better SEO:</strong> server rendering gives users a ready page and gives search engines clean HTML.</p>
</li>
<li><p><strong>Faster builds and releases:</strong> a modern pipeline replaced the slow .NET one.</p>
</li>
<li><p><strong>Easier hiring and upkeep:</strong> React and Node.js are widely known, so the team could grow and the code could be maintained.</p>
</li>
<li><p><strong>Reusable components:</strong> the booking flow, calculators and dealer search share one component library, so each feature isn't rebuilt from scratch.</p>
</li>
</ul>
<h2>The hard parts</h2>
<p><strong>Reusing the database.</strong> We kept the same database but gave it a new structure for the new application. That avoided a risky data move, but it meant mapping the old data carefully so nothing broke or went missing.</p>
<p><strong>Protecting SEO and URLs.</strong> A site this size has years of search ranking behind it. The old URLs had to keep working, or redirect to the right new page, so that traffic wouldn't drop on launch day.</p>
<p><strong>A single-day cutover.</strong> We didn't move the site in parts. We built the new platform in parallel and switched everything at once. That is a big commitment, and it needed enough testing, a rehearsed plan and a way back if something went wrong.</p>
<h2>What we built on the frontend</h2>
<p>The rebuild was not only a change of stack. The frontend also carried the parts of the experience that make a site feel modern:</p>
<ul>
<li><p><strong>Motion with GSAP.</strong> Animations were built with GSAP, which gave us fine control over timing and sequences.</p>
</li>
<li><p><strong>Video with Video.js.</strong> Videos hosted on YouTube played through Video.js, so the site had one consistent player instead of scattered embeds.</p>
</li>
<li><p><strong>A 360° product view.</strong> Visitors could rotate the product on screen, built entirely on the frontend.</p>
</li>
<li><p><strong>Lazy loading.</strong> Images, videos and heavier widgets such as the 360° view loaded only when they were needed, so the first page load stayed light.</p>
</li>
</ul>
<p>As frontend lead, the trade-off I kept in front of the team was simple: every animation, video and interactive feature has to earn its place against page speed. That is why lazy loading mattered as much as the features themselves.</p>
<h2>How we worked</h2>
<p>I led the frontend delivery, and I also had other accounts to look after, so the plan had to be clear enough to run without me in every conversation. I worked with the backend team on creating and integrating the APIs, agreeing on the contracts early so the frontend and backend could progress together and join up smoothly at the end.</p>
<h2>The result</h2>
<ul>
<li><p>Pages load about 40% faster than on the old site.</p>
</li>
<li><p>Build times dropped by about 30%, and releases are quicker.</p>
</li>
<li><p>SEO and traffic held up through the switch, with no major drop.</p>
</li>
<li><p>The team now works on a mainstream stack that is easier to maintain and hire for.</p>
</li>
</ul>
<h2>What I'd tell a team planning the same thing</h2>
<ol>
<li><p>Keep the database if you can. Change the structure around it, not the data itself.</p>
</li>
<li><p>Write down every important URL before you start, and check them after launch.</p>
</li>
<li><p>A one-day switch works only if you've rehearsed it and have a rollback.</p>
</li>
<li><p>Agree the API contracts with the backend team first. It saves the most time later.</p>
</li>
<li><p>Treat rich media as a budget: lazy-load what is below the fold, and load heavy widgets like a 360° viewer only when the visitor needs them.</p>
</li>
</ol>
<hr />
<p><em>Originally published at</em> <a href="https://sanjivsutar.in/blog/rebuilding-enterprise-automotive-platform-dotnet-to-nextjs"><em>sanjivsutar.in</em></a><em>.</em></p>
]]></content:encoded></item></channel></rss>