Examples

In keeping with the guiding principle to "Minimize Setup Friction," there are some things that may be pretty common for web applications to do, but aren't common enough to be included in the main template.

This page links to examples of how to implement some things with the Epic Stack.

• Framer Motion by @kentcdodds: Using client hints to avoid content layout shift with prefers-reduced-motion and framer motion animations.
• Cross-site Request Forgery Protection (CSRF) by @kentcdodds: An example of the Epic Stack with CSRF protection on forms.
• Epic Stack + OpenAI: by @kentcdodds: An example of the Epic Stack with OpenAI's GPT API (enhances the notes feature with "generate" buttons).
• Prisma Client Extensions by @L-Steinmacher: An example of the Epic Stack with Prisma Client extensions activated for enum like behavior in SQLite.
• Epic Stack + Storybook: by @moishinetzer: An example of the Epic Stack with Storybook. It also showcases creating a Remix stub, which is very helpful for isolating Remix-specific components inside of Storybook.
• Socket.IO: by @L-Steinmacher: An example of setting up using websockets in the Epic Stack using the Socket.IO library.
• User Impersonation by @alan2207: An example Remix application showcasing how to implement user impersonation in the Epic Stack.
• Epic Stack + Tailwind CSS Plugin by @hakimLyon: An example of the Epic Stack with Tailwind CSS Plugin.
• Epic Stack + GitHub Auth by @kentcdodds: An example of the Epic Stack with GitHub Auth.
• Epic Stack + MongoDB as the Database by @hakimLyon: An example of the Epic Stack with Prisma using MongoDB as the database.
• Epic Stack Custom Themes by @kiliman: An example showing how to create a custom theme using the shadcn-custom-theme tool.
• Epic Stack + OpenID Connect Auth (Google) by @kentcdodds: An example of the Epic Stack with OpenID Connect Auth (Google) using web-oidc and remix-auth.
• Epic Stack + Fathom Analytics by @xstevenyung: An example of the Epic Stack with Fanthom Analytics via CDN
• Epic Stack + Tenant Users by @vinstah: An example of the Epic Stack with tenant users and members starter
• Epic Stack + i18n by @rperon: An example of the Epic Stack with i18n using i18next and remix-18next
• Epic Stack + Argos by @jsfez: An example of the Epic Stack with Argos for visual testing
• Epic Stack monorepo with pnpm + turbo: An example of the Epic Stack in a monorepo setup, configs packages, UI package, and "client-hints" example package.
• Epic Stack + passkeys/webauthn by @rperon: An example of the Epic Stack with passkeys using remix-auth-webauthn and remix-auth.
• Epic Stack with jsx-email: An example of the Epic Stack that uses jsx-email instead of react-email

How to contribute

Watch: Contribute an Epic Stack Example

You don't need permission to contribute an example. Feel free to create your own repository based on the Epic Stack and add whatever you like for your example. Here are some tips:

1. Create an init commit as soon as you generate the project, before you make any changes. That way people can look at the commit history of your example and see what you've added.
2. Update the README.md with some information about what your example is about and call out any interesting things you've done.
3. Add the tags "epic-stack" and "epic-stack-example" so it will appear on this page on GitHub.
4. It's not normally necessary to deploy your example to production (simply comment out the deployment part of the GitHub workflow), but you can if you like.

Once you've made your repo, simply open a pull request to this page and add your example to the bottom of the list with a brief description.