GAIA React is a fully comprehensive template for building modern React web applications.
It is designed to be the best possible starting point for any professional React project.
It comes with EVERYTHING you need, fully configured and ready to go.
The Developer Experience (DX) is designed to be top-notch.
- Automated and robust code quality tools are all set up, keeping your code clean and tech debt to a minimum.
- Best practices are baked into the source code examples for you to follow.
- Utilities, hooks, authentication, components, services, styles, tests, stories, and other code examples are all included to help you get started quickly.
- Unit, integration, visual regression, and end-to-end tests are set up.
- While GAIA comes with recommended packages, conventions, and settings, you're free to change or remove them to suit your needs!
GAIA React has many great features built-in:
- Built with Remix, the best full-stack React framework for the modern web
- TailwindCSS for styling, along with CSS Module support
- Zod for data validation
- Robust ESLint ruleset along with Prettier and Stylelint
- Husky and Lint-Staged for pre-commit checks to ensure code quality
- A complete testing suite with Vitest, React Testing Library, and PlayWright
- Storybook and Chromatic, with a Remix Stub decorator included
- Mock Service Worker with working handlers, and msw/data for data mocking
- remix-auth with a working authentication example
- Toast notifications with remix-toast and react-toastify
- Internationalization via remix-i18next with sample files already in place
- RVF for form management and validation
- FontAwesome icons
- A convenient and flexible wrapper around fetch that simplifies API calls
- Many example components, ready for you to use and modify
- Useful utility functions and hooks
- Dark mode support
- And much more!
No matter what your skill level or experience, GAIA will make your life and your code better.
Read the GAIA Documentation for detailed information about working with GAIA.
Yes!
The GAIA Flash Framework revolutionized Flash website development and became the most popular Flash framework in the world (second only to Adobe Flex, which was focused on enterprise applications). It was used to build over 100,000 Flash sites and relied upon by every major digital agency worldwide.
GAIA React is its spiritual successor. It has been reborn as a React template. Like its predecessor, it's designed to be the most comprehensive and easy-to-use React template available, to build professional-grade frontend applications.
Make sure you have Node.js >=20.17.0 LTS installed, preferably via nvm.
All you need to do is run this installation command and get to work.
npx create-remix@latest --template gaia-react/remixWhen prompted, to install packages and run the remix.init, select "Yes".
If you choose "No", you will need to run these two commands manually after the installation:
npm install
npx remix initHere's how to develop with GAIA.
npm run storybooknpm run devThis template comes with Tailwind CSS configured, with some configuration and utilities, which you can change to suit your project.
See the Vite docs on css for more information.
FontAwesome is included. You're free to change it if you like.
Remix-i18next is configured with examples.
Storybook is already configured with react-i18n support.
GAIA comes with a full testing suite already configured.
npm t
// or
npm run testYou'll need to set your CHROMATIC_PROJECT_TOKEN env variable on your CI.
npx playwright testInteractive mode:
npx playwright test --uiGAIA comes with the default Remix deployment configuration. You can change this to whatever deployment process you prefer.
Here's the basic Remix deployment process:
npm run buildThen run the app in production mode:
npm startYou'll need to pick a host to deploy it to. Jacob Paris wrote a great article on where to host your Remix app.
If you're familiar with deploying Node applications, the built-in Remix app server is production-ready.
Make sure to deploy the output of npm run build
build/serverbuild/client