In this blog post, we'll cover everything you need to know to set up a React app that's ready for deployment.
GitHub Repo: https://github.com/shiv...
For further actions, you may consider blocking this person and/or reporting abuse
That's a great step by step guide to get kick start project.
I would add little more details such as adding anchor links to the docs for terms like webpack, ESLint, and Prettier.
Furthermore, also write an additional notes if there is still a better way to achieve similar goal.
Finally, an effective article that helps to dive inn!
Thanks @tarunchakravarthy for the feedback!
Great sharing,But why not just choose a mature scheme like vite?
Thanks, webpack is highly configurable that’s why it is used in large enterprise applications
So is vite. Vite has loads of options and builds on top of esbuild and rollup. Webpack is requires alot of configuration to do simple stuff.
thanks but why this when I can do it with vite
@xoulrage If you need extensive customization and full control over the bundling process, Webpack's rich plugin ecosystem and configuration options may be more suitable.
For larger codebases with a very large number of files (500+), Webpack may be able to compile the bundle faster than Vite, especially when using newer features like lazy compilation.
That statement is just false. We converted large solutions from webpack to Vite. Vite is faster in both development mode (20x faster) and 2-3x for production build
This is a great template for the newbies starting using react. Great job.
Antonio, CEO at Litlyx
Thanks @litlyx
please fix tsconfig.js => tsconfig.json
Thanks @viet_ho_398865447b7b14af8 for pointing out this mistake. I updated it.
webpack.prod.js is equal to webpack.dev.js. Wasn't production supposed to be more optimized?
Thanks @lucianodecezare for identifying my mistake. I accidentally pasted same config as dev. Updated webpack.prod.js with more configuration.
Or:
npm create vite@latest my-react-app -- --template react-ts
What advantages of this setup instead of Vite?
Webpack is mainly known / used for large applications bundling with highly configurable things. Vite is emerging to be a better tool but still don’t provide much flexibility. If you want minimum and quick configuration for your app then definitely Vite is a better choice.
same question. @shivampawar
Why is this approach better than using preexisting bundlers like vite?
@sunilkhadka001 If you need extensive customization and full control over the bundling process, Webpack's rich plugin ecosystem and configuration options may be more suitable.
For larger codebases with a very large number of files (500+), Webpack may be able to compile the bundle faster than Vite, especially when using newer features like lazy compilation.
it doesn't explain anything on how this optimizes your react app, It just shows us how to install npm packages
Installing npm package is not a big deal.
If you read this article properly then you will see webpack configuration other than just npm installation commands, I used plugins to minify production bundle size. Also, by using eslint you make sure that developer will write quality code.
It takes time and efforts to write a detailed post. So please don’t just directly say that it’s just a npm package installation steps.