Professional Documents
Culture Documents
Session 2
Session 2
Q: What is NPM?
A: It is a tool used for package management and the default package manager for
Node projects. NPM is installed when NodeJS is installed on a machine. It comes with
a command-line interface (CLI) used to interact with the online database of NPM.
This database is called the NPM Registry, and it hosts public and private 'packages.'
To add or update packages, we use the NPM CLI to interact with this database.
npm init -y can be used to skip the setup step, npm takes care of it and creates
the package.json json file automatically , but without configurations.
Q: What is Parcel/Webpack? Why do we need it?
A: Parcel/Webpack is type of a web application bundler used for development and
productions purposes or power our application with different type functionalities and
features. It offers blazing fast performance utilizing multicore processing, and
requires zero configuration. Parcel can take any type of file as an entry point, but an
HTML or JavaScript file is a good place to start. Parcel/Webpack are type of bundlers
that we use to power our application with different type functionalities and features.
Parcel Features:
HMR (Hot Module Replacement) - parcel keeps track of file changes via file
watcher algorithm and renders the changes in the files
File watcher algorithm - made with C++
Minification
Cleaning our code
DEV and production Build
Super fast building algorithm
Image optimization
Caching while development
Compresses
Compatible with older version of browser
HTTPS in dev
Port Number
Consistent hashing algorithm
Zero Configuration
Automatic code splitting
installation commands:
Install:
Parcel Commands :
o For development build:
npx parcel <entry_point>
Q: What is .parcel-cache?
A: .parcel-cache is used by parcel(bundler) to reduce the building time. It stores
information about your project when parcel builds it, so that when it rebuilds, it
doesn't have to re-parse and re-analyze everything from scratch. It's a key reason
why parcel can be so fast in development mode.
Q: What is npx?
A: npx is a tool that is used to execute the packages. It comes with the npm, when
you installed npm above 5.2.0 version then automatically npx will installed. It is an
npm package runner that can execute any package that you want from the npm
registry without even installing that package.
Q: What is difference between dependencies vs devDependencies?
A: Dependencies should contain library and framework in which your app is built on,
needs to function effectively. such as Vue, React, Angular, Express, JQuery and
etc. DevDependencies should contain modules/packages a developer needs during
development. such as, parcel, webpack, vite, mocha. These packages are necessary
only while you are developing your project , not necessary on production. To save a
dependency as a devDependency on installation we need to do,
npm install --save-dev
instead of just,
Q: What is .gitignore? What should we add and not add into it?
A: The .gitignore file is a text file that tells Git which files or folders to ignore in a
project during commit to the repository. The types of files you should consider
adding to a .gitignore file are any files that do not need to get committed. for
example, For security, the security key files and API keys should get added to the
gitignore. package-lock.json should not add into your .gitignore file.
The entries in this file can also follow a matching pattern.
package-lock.json:
This file is automatically generated for those operations where npm modifies
either the node_module tree or package-json.
It is generated after an npm install
It allows future devs & automated systems to download the same
dependencies as the project.
it also allows to go back to the past version of the dependencies without
actual ‘committing the node_modules folder.
It records the same version of the installed packages which allows to reinstall
them. Future installs will be capable of building identical description tree.
~ or ^ in package.json file : These are used with the versions of the package installed.
For example in package.json file:
"dependencies": {
"react": "^18.2.0",
"react-dom": "^18.2.0"
}
If none of them is present, that means only the version specified in package.json file
is used in the development.