Skip to content

Instantly share code, notes, and snippets.

Last active February 23, 2020 10:00
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
Star You must be signed in to star a gist
What would you like to do?
Modern web app stack

In all of these sections, I assume you want to use TypeScript as much as possible.

Backend / API

REST (OpenAPI) (no TS support ATM... see

Frontend friendly package

Restful React :

TS autogenerated client :

Generate a typed client / hooks from your OpenAPI introspection


Strapi + GraphQL plugin : with

Hasura :

Postgraphile :

Frontend friendly package

GraphQL Code Generator :

Generate a typed graphql client / hooks from your GraphQL API introspection

Database interaction

Prisma 2 :

Generate a typed client from your database introspection

Frontend / UI

Framework / Bundler

Next.js : (SSR, SSG, FS based routing, optional PWA via next-pwa, see

Create React App :

Parcel 2 :

Developper tools (DX)

React devtools :

Components "studio"

Storybook :

Blocks UI :

React cosmos :

Build your app in isolation, one component at a time.


Navi :

React-router v6 :

Support for Suspense and render-as-you-fetch (

State management

XState :

Zustand :

Data fetching

React-query :

Graphql-tag :

For GraphQL, use fragment based approach :


React-final-form :

Formik :


Theme-UI :

Emotion :

Classy UI : (utility first approach built on top of

CSS prop with theme available in every component via custom pragma


Framer Motion :

React-spring :

Design system / UI kit

Material-UI :

Chakra :

Reakit :

Semantic UI :

Fabric :


Test runner

Jest : (with TS :

Model-based testing

Xstate :

Unit / Integration

React-testing-library : with complements such as and

Functional / E2E

Playwright : (with Jest :

Codecept :

Cypress : (Mocha instead of Jest, rely on JQuery...)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment