Home

Awesome

<a href="https://retail.nikolailehbr.ink/"> <img alt="ReTail project image" src="https://github.com/user-attachments/assets/8ef8b5dd-0d1b-4d26-b19a-5e651cd0f51e"> <h1 align="center">ReTail</h1> </a> <p align="center"> A refined Remix starter template with improved defaults for building full-stack web applications. </p> <p align="center"> <a href="#why"><strong>Why</strong></a> · <a href="#features"><strong>Features</strong></a> · <a href="#development"><strong>Development</strong></a> · <a href="#deployment"><strong>Deployment</strong></a> </p> <br/>

[!TIP] If you want to try out this template with Tailwind CSS v4.0 Beta, you can do so by switching to the tailwind-v4 branch .

Why

When I first started using the official Remix template with Vite, it lacked built-in support for Tailwind CSS. Setting up a new project meant repeatedly installing and configuring it manually. To streamline this process, I created my own starter template: ReTail (Remix + Tailwind).

Since then, the official Remix template has added Tailwind CSS support. However, I continue to use ReTail to define better defaults, include ESLint 9, and integrate helpful utilities that make working with Tailwind CSS and other packages more efficient.

Features

Development

Run the Vite dev server:

npm run dev

This will automatically open the app in your default browser and expose the host IP to your network, enabling better testing on devices like smartphones.

Deployment

First, build your app for production:

npm run build

Then run the app in production mode:

npm start

Now you'll need to pick a host to deploy it to.