GraphQL Tutorial #23 - Create React App

Hey, in this GraphQL tutorial I'll start to create the React app using the create-react-app package.

----- COURSE LINKS:

======== Other Tutorials =========

----- NODE.JS TUTORIALS

----- MONGODB TUTORIALS

----- REACT TUTORIALS

======== Social Links ==========

[krishpoptani]

Best tutorial even after 6 years.
Damn its soo good to see class components in react.

[Mayankkumargeek]

Best Tutorial on React GraphQL so far. Enjoying till now. Only frontend remaining.

[darrylbrian]

If anyone wants the Nunito font add the following...


In body declaration of index.css: font-family: "Nunito", sans-serif;

[martinwood]

Without question the most understandable tutorial series for GraphQL on the whole of youtube. Just starting on the react part now and still loving this series. Keep up the hard work my friend! :D

[MrManpreetSingh]

You are a great man, Thanks for sharing your knowledge with perfect way.

[psionicronin]

---- *USEFUL TIP* ----
After installing concurrently (`npm i concurrently -S`) on the server side, in my `/server/package.json` I have the following scripts:

"scripts": {
"client": "npm run start --prefix ../client",
"server": "nodemon app.js",
"dev": "concurrently \"npm run server\" \"npm run client\""
}

Thus, when you type `npm run dev` it will start both your API and your React app in the same terminal/shell. Hope you find this useful!

Edit: Header

[danielquangdao]

Great great work Ninja, great educator

[alifreeze-yt]

If someone wants to use GraphQL using hooks purely

you can refer to my repo here


It's written 100% using react hooks and is the same project as this one :)

[OPQR]

wow this tutorial is sooo good, more ppl need to see this xD

[nitinmodi]

I tried running the same command but the process stuck at initializing the react, react-dom....
I also tried the npx create-react-app but it also got stuck at the same point

[ahmedelabd]

If you suffered from this ERROR :(
create-react-app starting error - Error: No valid exports main found for '\node_modules\colorette'
Try to uninstall Node.js and reinstall it with latest version also use npx create-react-app "Project Name" instead of npm .

[creative-commons-videos]

please make a video on graphql subscription using apollo client

[raymondmichael]

Just to pull you back again; can you advice me on how I can use the Express server to run both sides from the same port {server & client), I'd like to make something "live belt" type of thing from this t=lovely series.
Thanks in advance,
Greetings from Tanzania

[samb.]

How can we make you say the word “browser” more often ?

[adelal-rafiq]

I have installed using "npx create-react-app client" but when I try to delete the app.css file, it can't delete.
Please help!

[ImanAboheydary]

in the first image show #22 but this is #23