Multi-language support in your Node.js and Express

Implementing multi-language support in your Node.js and Express application using internationalization (i18n) involves using a library like i18n to manage translations. Below is a step-by-step guide to enhance your application with multi-language support.

Step 1: Set Up Your Project

Create a new project folder:

 mkdir multi-language-app
 cd multi-language-app

Initialize a new Node.js project:
```
 npm init -y
```
Install necessary dependencies:
```
 npm install express ejs i18n
```

Step 2: Create Your Folder Structure

Create the following folder structure:

multi-language-app/
|-- src/
|   |-- views/
|       |-- index.ejs
|   |-- routes/
|       |-- index.js
|   |-- app.js
|-- server.js
|-- locales/
|   |-- en.json
|   |-- fr.json
|-- .gitignore
|-- package.json

Step 3: Set Up Express Server

In app.js, set up an Express server and configure i18n:

const express = require('express');
const path = require('path');
const i18n = require('i18n');

const app = express();
const PORT = process.env.PORT || 3000;

app.set('view engine', 'ejs');
app.use(express.static(path.join(__dirname, 'src/public')));

// i18n configuration
i18n.configure({
  locales: ['en', 'fr'],
  directory: path.join(__dirname, 'locales'),
  defaultLocale: 'en',
  cookie: 'lang',
});

app.use(i18n.init);

// Routes
const indexRoutes = require('./src/routes/index');
app.use('/', indexRoutes);

app.listen(PORT, () => {
  console.log(`Server is running on http://localhost:${PORT}`);
});

Step 4: Create Routes

In routes/index.js, set up routes for handling language changes:

const express = require('express');
const router = express.Router();

router.get('/', (req, res) => {
  res.render('index');
});

router.get('/change-language/:lang', (req, res) => {
  const lang = req.params.lang;
  res.cookie('lang', lang);
  res.redirect('back');
});

module.exports = router;

Step 5: Create Views

In views/, create the following EJS template:

index.ejs: Display the main page with language change links.

Step 6: Create Main Page

In views/index.ejs, create the main page:

<!-- views/index.ejs -->
<!DOCTYPE html>
<html lang="<%= i18n.getLocale() %>">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title><%= __('app.title') %></title>
</head>
<body>
  <h1><%= __('app.greeting') %></h1>
  <p><%= __('app.description') %></p>
  <div>
    <a href="/change-language/en">English</a> |
    <a href="/change-language/fr">Français</a>
  </div>
</body>
</html>

Step 7: Create Language Files

In the locales/ folder, create language JSON files:

`en.json`

{
  "app": {
    "title": "Multi-Language App",
    "greeting": "Hello!",
    "description": "Welcome to the multi-language app."
  }
}

`fr.json`

{
  "app": {
    "title": "Application Multi-langue",
    "greeting": "Bonjour !",
    "description": "Bienvenue dans l'application multi-langue."
  }
}

Step 8: Run Your Application

In server.js, use the exported app to start the application:

const app = require('./src/app');

const PORT = process.env.PORT || 3000;

app.listen(PORT, () => {
  console.log(`Server is running on http://localhost:${PORT}`);
});

Start the server:

node server.js

Visit http://localhost:3000 in your browser to see and interact with your multi-language app. Click on the language change links to switch between English and French.

Congratulations! You've successfully implemented multi-language support in your Node.js and Express application using internationalization (i18n). Customize and expand this application based on your specific requirements and language translations.