Beginner-Friendly Topic
Take your time - it's perfectly normal to re-read this topic 2-3 times. Try the interactive code editor below to run code yourself. Use the Q&A section to check your understanding before moving on. You've got this! 🚀
npm & Package Management
npm (Node Package Manager) is the world's largest software registry. It lets you install and use thousands of open-source packages - from utility libraries (lodash) to full frameworks (React). Every JavaScript project uses npm.
npm Essentials
- npm init -y - Create package.json (project config file)
- npm install <package> - Install a dependency: npm install axios
- npm install -D <package> - Dev dependency (testing, linting only): npm install -D jest
- package.json - Lists all dependencies, scripts, project info
- package-lock.json - Exact dependency versions. Commit this file!
- node_modules/ - Where packages are stored. Never commit (add to .gitignore)
- npx - Run packages without installing: npx create-react-app myapp
- npm scripts - Custom commands: npm run build, npm test, npm start
npm Code
// package.json structure
const packageJson = {
"name": "my-project",
"version": "1.0.0",
"description": "My JavaScript project",
"main": "index.js",
"scripts": {
"start": "node index.js",
"dev": "nodemon index.js",
"build": "webpack --mode production",
"test": "jest",
"lint": "eslint src/"
},
"dependencies": {
"axios": "^1.6.0", // API requests
"express": "^4.18.0" // Server framework
},
"devDependencies": {
"jest": "^29.7.0", // Testing
"eslint": "^8.56.0", // Code quality
"nodemon": "^3.0.0" // Auto-restart
}
};
console.log("package.json:", JSON.stringify(packageJson, null, 2));
// Common npm commands:
// npm init -y → create project
// npm install axios → add dependency
// npm install -D jest → add dev dependency
// npm uninstall axios → remove package
// npm update → update all packages
// npm audit → check for vulnerabilities
// npm run build → run custom script
// Popular packages to know:
// axios - HTTP requests (better than fetch)
// lodash - Utility functions
// dayjs - Date handling (lightweight Moment.js alternative)
// uuid - Generate unique IDs
// dotenv - Environment variables
console.log("npm is essential for every JavaScript project!");Tip
Tip
Use npm init -y to quickly create package.json. Add a .gitignore file that includes node_modules/ immediately. Committing node_modules is one of the most common beginner mistakes.
package.json = your project's blueprint. node_modules = downloaded packages. Always gitignore node_modules!
Common Mistake
Warning
Not locking dependency versions. Without package-lock.json, npm install might install different versions on different machines, causing 'works on my machine' bugs. Always commit package-lock.json to your repository.
Practice Task
Note
npm practice: (1) Initialize a project with npm init. (2) Install lodash as a dependency and jest as a devDependency. (3) Create a start script in package.json. (4) Use npx to run a one-off package.
Quick Quiz
Key Takeaways
- npm (Node Package Manager) is the world's largest software registry.
- npm init -y - Create package.json (project config file)
- npm install <package> - Install a dependency: npm install axios
- npm install -D <package> - Dev dependency (testing, linting only): npm install -D jest