How to Create a React App With React Query Builder Using npm

Setup#

To get started building the application, we'll need to bootstrap it with Create React App. Create React App is a tool that helps initialize React projects and it's one of the quickest ways to get started writing a React application.

Start by making a myapp directory and changing into that directory:

mkdir myapp

Next, initialize a git repository within that directory.

git init

Then run the npx command to generate a new React application using Create React App in a folder called client. We'll use the typescript template, and force the use of npm since that's what our remote server will use.

npx create-react-app client --template typescript --use-npm

(We do it this way, i.e. myapp/client, to get ready for the full application later.)

Finally, let's add some additional dependencies, react-querybuilder and node-sass.

npm i react-querybuilder node-sass@^4.14.1

Once that command is finished, delete the unnecessary files:

• src/setupTests.ts

• src/App.test.tsx

• src/logo.svg

• src/reportWebVitals.ts

• public/favicon.ico

• public/logo*.png

• public/manifest.json

• public/robots.txt