ReactDOM
ReactDOM is a core React package that provides DOM-specific methods to interact with and manipulate the Document Object Model (DOM), enabling efficient rendering and management of web page elements.
ReactDOM is used for:
Rendering Components: Displays React components in the DOM.
DOM Manipulation: Allows efficient DOM updates.
Server-Side Rendering: Supports rendering on both client and server.
React & DOM Bridge: Connects React with the browser’s DOM.
npm
npm is a tool used to install and use packages in JavaScript
It helps developers use ready made code instead of writing everything from scratch
bundler
A bundler combines many files like js css images into fewer files
This makes the website faster and organized
Examples are webpack parcel vite
webpack
Webpack is a bundler
It combines and optimizes files
It also supports plugins and code splitting
It works with babel to support old browsers
babel
Babel converts modern JavaScript into older JavaScript
This helps code run in all browsers
parcel
Parcel is a bundler with zero configuration
No setup needed
Easy for beginners
It has fast server and automatic features
webpack vs parcel
Webpack needs configuration and is powerful
Parcel is simple and easy to use
Webpack is for big projects
Parcel is for small or medium projects
parcel cache
Parcel creates a cache folder
It stores build data
This makes future builds faster
npx
npx is used to run packages without installing globally
Example
npx parcel index html
dependencies vs devdependencies
dependencies are needed to run the app
devdependencies are used only during development