How to output server-side console.log to browser’s console in Express.js with EJS template?

I’m building a weather forecast application using Express.js and EJS templates (for my college’s class). Currently, my console.log statements in server.js are only visible in the terminal/server console. I want to make these logs visible in the browser’s developer tools console for debugging purposes.

Here’s my current codes:

server.js:

import express from 'express';
import bodyParser from 'body-parser';
import path from 'path';
import axios from 'axios';

const app = express();
const API_KEY = 'MY_API_KEY_FOR_OPENWEATHERMAP';
const PORT = 3000;

// Add these middleware configurations before your routes
app.use(bodyParser.urlencoded({ extended: true }));
app.use(bodyParser.json());

// define the __dirname
const __dirname = path.resolve();

async function getForecast(city) {
    const url = `https://api.openweathermap.org/data/2.5/forecast?q=${city}&appid=${API_KEY}&units=metric`;
    // fetch version
    // const response = await fetch(url);
    // const data = await response.json();

    // axios version
    const response = await axios.get(url);
    const data = response.data;
    
    if (data.cod !== '200') {
        throw new Error(data.message);
    }
    
    return data;
}

app.get('/', (req, res) => {
    res.render(__dirname + '/weather.ejs');
});

app.post('/', async (req, res) => {
    try {
        const { city } = req.body;
        
        if (!city) {
            return res.status(400).render(__dirname + '/weather.ejs', { 
                error: 'City name is required' 
            });
        }

        const forecast = await getForecast(city);
        const dailyForecasts = forecast.list.filter((f, i) => i % 8 === 0);

        res.render(__dirname + '/weather.ejs', {
            city: forecast.city.name,
            forecasts: dailyForecasts
        });
    } catch (error) {
        res.render(__dirname + '/weather.ejs', { 
            error: error.message 
        });
    }
});

app.listen(PORT, () => {
    console.log(`Port ${PORT} is running.`);
});

weather.ejs

<!DOCTYPE html>
<html>
<head>
    <title>5-Day Weather Forecast</title>
    <style>
        .container { 
            max-width: 800px; 
            margin: 0 auto; 
            padding: 20px; 
        }
        .forecast-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
            gap: 20px;
            margin-top: 20px;
        }
        .forecast-card {
            border: 1px solid #ddd;
            padding: 15px;
            border-radius: 8px;
            background: #f5f5f5;
        }
        .error {
            color: red;
            margin: 10px 0;
        }
    </style>
</head>
<body>
    <div class="container">
        <h1>Weather Forecast</h1>
        
        <form action="/" method="POST">
            <input type="text" name="city" placeholder="Enter city name">
            <button type="submit">Get Forecast</button>
        </form>

        <% if (locals.error) { %>
            <div class="error"><%= error %></div>
        <% } %>

        <% if (locals.forecasts) { %>
            <% console.log(locals.forecasts) %>
            <h2>5-Day Forecast for <%= city %></h2>
            <div class="forecast-grid">
                <% forecasts.forEach(forecast => { %>
                    <div class="forecast-card">
                        <h3><%= new Date(forecast.dt * 1000).toLocaleDateString() %></h3>
                        <p>Temperature: <%= forecast.main.temp %>°C</p>
                        <p>Weather: <%= forecast.weather[0].main %></p>
                        <p>Humidity: <%= forecast.main.humidity %>%</p>
                        <p>Wind Speed: <%= forecast.wind.speed %> m/s</p>
                    </div>
                <% }) %>
            </div>
        <% } %>
    </div>
</body>
</html>

(My Local environment)

Mac M2
VSCode Version: 1.94.2 (Universal)
Chrome Version: 131.0.6778.70（Official Build）（arm64）

In my `weather.ejs` file, I used `<% console.log(locals.forecasts) %>` hoping to see the output in the browser’s console. However, it only shows up in my VSCode terminal instead.

How can I get the output to appear in the browser’s console?