What are Modules?

When your JavaScript code grows large and complex, it becomes difficult to manage everything in one file. The solution is modules: splitting your code into separate, organized files.

A module is a JavaScript file that contains related code. Each module handles one specific job, making your application easier to understand and maintain.

A JavaScript module is a regular .js file that can export code (variables, functions, classes) so other files can import and use it.

Example:

One Messy File:

// file: messy-app.js
let user = "John";
let score = 0;

function login() {
  console.log("Welcome " + user);
}

function addPoints(points) {
  score += points;
}

Two files organized with Modules:

// file: user-module.js
let user = "John";
function login() {
  console.log("Welcome " + user);
}
// file: game-module.js  
let score = 0;
function addPoints(points) {
  score += points;
}

user-module.js - It handles user authentication and user-related data and contains the username and login functionality.

game-module.js - It manages game scoring and points system and tracks the score and handles point calculations.