Setting up the environment

Question 1

What is the easiest way to create a react environment?

Answer 1

using npx create-react-app

Question 2

What is necessary to have to run create-react-app?

Answer 2

Is is necessary nodejs

Question 3

What npm stands for?

Answer 3

Node package manager

Question 4

What does npx stands for?

Answer 4

Node package execute

Question 5

What is npm eject?

Answer 5

It will stop hiding what it’s got installed under the hood by create-react-app and instead eject those things into your project’s package.json for everyone to see

Question 6

How to create a react environment without create-react-app? Where to find the full list and details?

Answer 6

create a new dir and then do a npm init -y, after that install depenencies (e.g: express, react and react-dom, webpack, webpack-cli and babel , nodemon, ESLint )

Full list and details can be found at: jscomplete.com/reactful

Question 7

Will “npm install” command install the package and its dependencies automatically?

Answer 7

Yes… all dependencies’ dependencies will automatically installer as well..

Question 8

What is webpack? Why does it exist? Will browsers support it automatically?

Answer 8

webpack bundles all the packages together in a single bundle file to be able to send to the browser. It exists because browser do not support it but seems that will support at some point.

Question 9

What is babel? What does it do?

Answer 9

Babel is another module necessary for react. It translates JSX to React-API calls. Also guarantee backward compatibility of new JS features with older browsers.

Question 10

What is nodemon?

Answer 10

Allows node to refresh automatically in case of changes.

Question 11

What is ESLint?

Answer 11

Checks if code is working and also checks for best practices including styling.

Question 12

What is the difference between dependencies and devDependencies?

Answer 12

dependencies are required by the production server and development environment and devDependencies is only necessary for development environment and CI/CD - won’t go to production;

Question 13

What is prettier?

Answer 13

Make the react file auto indented.

Question 14

What is the common extension of a file that configures a dependency?

Answer 14

.config.js

Question 15

What is the reactful package?

Answer 15

Similar to create-react-app but with the bare minimum feature to make react work and also it ejects the modules by default.

Question 16

How to make vs code format on save?

Answer 16

There’s a setting called Format On Save that executed prettier automatically.

Question 17

What is the scss extension?

Answer 17

It is the sass css file…. normal css also fits here.

Question 18

How to separate components into separated files?

Answer 18

By creating the files and exporting the component itself (object). After that is necessary to import it in the other files.

Question 19

What is the syntax to export the component (object)? And what is the syntax to import it again?

Answer 19

export default PlayNumber;

Import PlayNumber from “./PlayNumber”

Question 20

Where to find more games to build with react?

Answer 20

jscomplete.com/react-beyond-basics

Question 21

What is recommended to use when using React with APIs? Is there a course on Pluralsight?

Answer 21

To use GraphQL. Same has a course on pluralsight.

Question 22

What are the common webpack properties that need to be declared?

Answer 22

Output, devserver, plugins, module and loaders.