AllWebSD.com

Just a Web Developer storytelling, teaching and community building out of America's Finest City.

Features

A modern, production-ready template for building full-stack React applications using React Router, deployed to Netlify.

• 🚀 Server-side rendering
• ⚡️ Hot Module Replacement (HMR)
• 📦 Asset bundling and optimization
• 🔄 Data loading and mutations
• 🔒 TypeScript by default
• 🎉 TailwindCSS for styling
• 🌼 daisyUI for component library
• 🌓 Light/Dark Mode aka "City Connect"
• 🔍 Lexical Search for episodes
• ☁️ Netlify Functions (Weather data fetched from Open-Meteo, RSS Feed fetched from Castbox, OpenAI)
• 🧪 Unit testing with Vitest
• 📖 React Router docs
• 💻 Configured for deployment to Netlify

Getting Started

Installation

Install the dependencies:

npm install

Development

Start the development server with HMR:

npm run dev

Your application will be available at http://localhost:5173.

Unit Testing:

Test all unit tests found in tests directory.

npm test

Building for Production

Create a production build:

npm run build

Previewing a Production build

To preview a production build locally, use the Netlify CLI:

Option 1 - Serve production build directly:

npx netlify dev --dir build/client --port 8888

Option 2 - Use default dev command (may have asset serving issues):

npx netlify-cli dev

Make sure to build first:

npm run build

Deployment

This template is preconfigured for deployment to Netlify.

Follow https://docs.netlify.com/welcome/add-new-site/ to add this project as a site in your Netlify account.

Styling

This template comes with Tailwind CSS already configured for a simple default starting experience. You can use whatever CSS framework you prefer.

See also

Guide: how to deploy a React Router 7 site to Netlify

---

Built with ❤️ using React Router.