React (with vite and typescript)

I have been using Next.js since 2018 in production. However, I am annoyed with their ever-growing do everything bs. So, I created this simple React application template that supports:

• Server side and client side rendering, as well as static site generation (a.k.a. pre-rendering)
• File-based routing (nested)

A React app template to help you get started with React + Vite + TypeScript.

Getting started

$ git clone https://github.com/th0th/react-vite-ts.git
$ cd react-vite-ts
$ pnpm install
$ pnpm run dev

Running

Development

Vite support Hot Module Reloading (HMR) out of the box.

1. Install dependencies

   $ pnpm install

2. Run development server

   $ pnpm run dev

   Then the application should be accessible on http://localhost:5173.

Production

You have 3 choices for running the application in production environment.

1. Server side rendering

   $ pnpm install
   $ pnpm run build
   $ pnpm run serve

2. Client side rendering

   $ pnpm install
   $ pnpm run build:client

   Then you can use any kind of web hosting service, and upload the contents of the dist/client directory.

3. Static site

   $ pnpm install
   $ pnpm run generate

   Then again, you can use any kind of web hosting service, and upload the contents of the dist/static this time.

Shameless plug

I am an indie hacker, and I am running two services that might be useful for your business. Check them out :)

WebGazer

WebGazer is a monitoring service that checks your website, cron jobs, or scheduled tasks on a regular basis. It notifies you with instant alerts in case of a problem. That way, you have peace of mind about the status of your service without manually checking it.

PoeticMetric

PoeticMetric is a free as in freedom, open source, privacy-first and regulation-compliant website analytics tool.

No cookies or personal data collection. So you don't have to worry about cookie banners or GDPR, CCPA, and PECR compliance.

License

Copyright © 2023, Gökhan Sarı. Released under the MIT License.