create-react-app-without-CRA

This repo manually configure a minimal setup for React without create-react-app.

Steps to create react app use webpack and babel:

Run npm init to manage your package.
Then Run npm install webpack webpack-cli --save-dev to install webpack and webpack-cli. Webpack is a module bundler. It takes modules with dependencies and generates a static file that could be served to browser.
Create a src folder for resource and a dist folder for distributable. Create index.html file under the dist folder and index.js file under the src folder.
Write a simple 'Hello world' react app in src folder. To make the dependencies to work, just install it.
To make webpack work for react app, we need to install babel loader and configure webpack to use babel loader to transform JS and JSX file.
To make babel work, we need to configure babel using @babel/preset-react and @babel/preset-env.
And now when you run npx webpack, you can see main.js file is generated. We need to add this script in index.html.
Add build script in package.json so that you don't need to remember the command for running webpack, just run npm run build.

Now when you open index.html with browser, you can see 'Hello world' on the page! Checkout commits for each step.

Also! Checkout webpack start tutorial for more explanation and feature. Checkout babel for more explanation and feature.

I read a tutorial online to implement this. Checkout using-CDN-link branch to see the example.