NPM and How it is Used with Web Apps

• Node Package Manager (NPM), is used to install, manage and share packages

• Initialises a package.json file, will ask for information about author, date, etc

    npm init

• Installing npm packages/libraries

    npm install <packageName> (Installs into dependencies of current directory)
    --save-dev (Installs into devDependencies of current directory)
    -g (Installs a package globally onto system)

Package.json file

• Package.json files are generated alongside node_modules directory when you run the init command
  • This file contains information about the app, such as developer details, licensing, etc.
  • Most importantly, dependencies and scripts
    • Dependencies are required by the app to run
    • Scripts, for automation; to build, run, update, etc
• node_modules is a folder that contains the source code of packages/libraries you have installed
  • Usually put into .gitignore to avoid pushing a large file onto a remote repository
  • When downloading a fresh app with a package.json, would need to run the follow command
• Example Package.json file

{
  "name": "Name of the React App",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "dev": "webpack serve",
    "run": "npm start"
  },
  "keywords": [],
  "author": "David W",
  "license": "ISC",
  "dependencies": {
    "react": "^18.2.0",
    "react-dom": "^18.2.0"
  },
  "devDependencies": {
    "webpack": "^5.75.0",
    "webpack-cli": "^5.0.1",
    "webpack-dev-server": "^4.11.1"
  }
}