How to start a React Project in 2023

This page summarizes the projects mentioned and recommended in the original post on news.ycombinator.com

Our great sponsors
  • SurveyJS - Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App
  • InfluxDB - Power Real-Time Data Analytics at Scale
  • WorkOS - The modern identity platform for B2B SaaS
  • madatdata

    ๐Ÿ˜  ๐Ÿ“ˆ Madatdata ("mad at data") is a TypeScript library for managing and querying SQL databases (so far including Seafowl and Splitgraph, but with an interface that makes it easy to add plugins for other databases).

  • If you're interested, this is the "absolute minimum" React project I was able to create, using `esbuild` (see `dev.mjs`) and some .html files. [0] It's a sub-package in a larger workspace, so there is some complexity inherited from the monorepo in terms of tsconfig.json and dependency management, but you can ignore that; the esbuild part was pleasantly simple to implement, and it pretty much "just works," such that each file in `www` is an entrypoint with one corresponding script from `pages/` that calls `createRoot(container).render()`.

    [0] https://github.com/splitgraph/madatdata/tree/main/packages/t...

  • tamagui

    Style React fast with 100% parity on React Native, an optional UI kit, and optimizing compiler.

  • If you are targeting native and web, I think the Tamagui + Solito starter that lets you share code between Expo/Nextjs is unbeat (disclaimer, I made Tamagui):

    Just `npm create tamagui@latest`

    See: https://tamagui.dev

    Happy hacking!

  • SurveyJS

    Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App. With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.

    SurveyJS logo
  • react.dev

    The React documentation website

  • Yep, see https://github.com/reactjs/react.dev/pull/5487#issuecomment-...

  • is-land

    A new performance-focused way to add interactive client-side components to your web site.

  • Mostly because of partial/conditional hydration. But you can achieve the same thing with is-land[1] on Rails as well.

    [1]: https://github.com/11ty/is-land

  • Prisma

    Next-generation ORM for Node.js & TypeScript | PostgreSQL, MySQL, MariaDB, SQL Server, SQLite, MongoDB and CockroachDB

  • Prisma does the heavy lifting on our project:

    https://www.prisma.io

    I don't have experience with Knex so I, unfortunately, don't have an answer to your question.

  • Tailwind CSS

    A utility-first CSS framework for rapid UI development.

  • Personally I suck at CSS and avoid writing it like the plague, even after 20+ years of doing it.

    I use TailwindCSS [1] for all my styling needs and couldn't be happier.

    If you really want scoped CSS in React this approach [2] can also work, and it makes it easy to use tailwind if you want.

    [1] https://tailwindcss.com

  • craco

    Create React App Configuration Override, an easy and comprehensible configuration layer for Create React App.

  • I am not much of a fan of CRA myself but I am very much glad that https://craco.js.org exists - so far it's handled my needs for tweaking CRA behaviour in situations where "eject" didn't seem like a good route to take.

    Mostly tbh to stop the freaking thing spawning inotify watchers for the entire contents of node_modules - I don't mind having to do a manual restart when I've changed dependencies and I definitely -do- mind having it eat a shedload of my user's inotify kernel allocation. (I know you can up the allocation, that's not the point, why are you on my lawn? :)

  • InfluxDB

    Power Real-Time Data Analytics at Scale. Get real-time insights from all types of time series data with InfluxDB. Ingest, query, and analyze billions of data points in real-time with unbounded cardinality.

    InfluxDB logo
  • core

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web. (by vuejs)

  • nx

    Smart Monorepos ยท Fast CI

  • An interesting article, but it's unfortunately one more that misses the elephant in the room: Nrwl NX: https://nx.dev/

  • create-react-app

    Set up a modern web app by running one command.

  • Seems you are right. More context here: https://github.com/facebook/create-react-app/issues/13077

NOTE: The number of mentions on this list indicates mentions on common posts plus user suggested alternatives. Hence, a higher number means a more popular project.

Suggest a related project

Related posts