
I Got Tired of React Router Boilerplate — So I Built Next.js Routing for Vite
I love React. I love Vite. Fast builds, full control, no magic, no framework telling me how to structure my entire application. Just React the way it was meant to be used. But every single project, without fail, I found myself writing this: import { BrowserRouter , Routes , Route } from ' react-router ' import Home from ' ./pages/Home ' import About from ' ./pages/About ' import Blog from ' ./pages/Blog ' import BlogPost from ' ./pages/BlogPost ' import NotFound from ' ./pages/NotFound ' function App () { return ( < BrowserRouter > < Routes > < Route path = "/" element = { < Home /> } /> < Route path = "/about" element = { < About /> } /> < Route path = "/blog" element = { < Blog /> } /> < Route path = "/blog/:id" element = { < BlogPost /> } /> < Route path = "*" element = { < NotFound /> } /> </ Routes > </ BrowserRouter > ) } Every. Single. Project. And every time a new page gets added, I open this file, add an import at the top, add a Route at the bottom, save, and get back to what
Continue reading on Dev.to React
Opens in a new tab
