In this tutorial, we'll learn how to set up a MERN stack on Rocky Linux 10.
We demonstrate how we can set up a complete MERN environment on Rocky Linux 10 and validate the installation using a working “Hello World” API connected to a React application. This walkthrough focuses on practical configuration steps, service verification, and a clean development workflow suitable for both learning and production-ready projects.
Prerequisites
Before we begin, let’s ensure we have the following in place:
- A Rocky Linux 10 dedicated server or KVM VPS.
- A basic programming knowledge.
How to Set Up a MERN Stack on Rocky Linux 10
Step 1. Prepare and Update Our System
First, let’s make sure our Rocky Linux 10 server is up-to-date and has the tools we need.
sudo dnf update -y
sudo dnf install -y git curl wget
Step 2. Install Node.js (LTS)
We want a stable, long-term support version at the moment that’s Node.js 24.x. We’ll pull it from NodeSource.
curl -fsSL https://rpm.nodesource.com/setup_24.x | sudo bash -
sudo dnf install -y nodejs
Verify versions:
node -v # should print v24.x.x
npm -v # will print npm 11.x or similar
Step 3. Install MongoDB Community Edition
Rocky Linux 10 doesn’t ship MongoDB by default, so we’ll add the official MongoDB repo for RPM-based distros.
cat <<EOF | sudo tee /etc/yum.repos.d/mongodb-org-8.0.repo
[mongodb-org-8.0]
name=MongoDB Repository
baseurl=https://repo.mongodb.org/yum/redhat/9/mongodb-org/8.0/x86_64/
gpgcheck=1
enabled=1
gpgkey=https://pgp.mongodb.com/server-8.0.asc
EOF
Now, install MongoDB and start the service using following command:
sudo dnf install -y mongodb-org
sudo systemctl enable --now mongod
This way we can use mongosh command and get into database cli.
Quick test:
mongosh --eval 'db.runCommand({ connectionStatus: 1 })'
You should see “ok: 1” indicating the server is running.
{
authInfo: { authenticatedUsers: [], authenticatedUserRoles: [] },
ok: 1
}
Step 4: Open Firewall Ports
sudo firewall-cmd --permanent --add-port=5173/tcp
sudo firewall-cmd --reload
Step 5: Create Project Structure
mkdir -p ~/mern-hello/{backend,frontend}
cd ~/mern-hello
Backend Setup
Step 6: Initialize Express API
cd backend
npm init -y
npm install express cors mongodb
npm install -D nodemon
npm pkg set scripts.dev="nodemon server.js"
Step 7: Create API Server
Create server.js:
nano server.js
Paste:
const express = require("express");
const cors = require("cors");
const { MongoClient } = require("mongodb");
const app = express();
const PORT = 5000;
const MONGO_URL = "mongodb://127.0.0.1:27017";
app.use(cors());
app.use(express.json());
app.get("/api/hello", (req, res) => {
res.json({ message: "Hello from Express API" });
});
app.get("/api/mongo-ping", async (req, res) => {
const client = new MongoClient(MONGO_URL);
try {
await client.connect();
await client.db().admin().ping();
res.json({ status: "MongoDB connection successful" });
} catch (e) {
res.status(500).json({ error: e.message });
} finally {
await client.close();
}
});
app.listen(PORT, () => {
console.log(`API running on port ${PORT}`);
});
Run the backend:
npm run dev
Similar output:
> backend@1.0.0 dev
> nodemon server.js
[nodemon] 3.1.11
[nodemon] to restart at any time, enter `rs`
[nodemon] watching path(s): *.*
[nodemon] watching extensions: js,mjs,cjs,json
[nodemon] starting `node server.js`
API running on port 5000
Frontend Setup
Step 8: Create React App Using Vite
cd ../frontend
npm create vite@latest . -- --template react
npm install
Step 9: Configure Proxy
Edit vite.config.js:
nano vite.config.js
Add following code:
import { defineConfig } from "vite";
import react from "@vitejs/plugin-react";
export default defineConfig({
plugins: [react()],
server: {
proxy: {
"/api": "http://127.0.0.1:5000",
},
},
});
Step 10: Update React App
Edit src/App.jsx:
nano src/App.jsx
Adjust following code:
import { useEffect, useState } from "react";
function App() {
const [msg, setMsg] = useState("");
useEffect(() => {
fetch("/api/hello")
.then((r) => r.json())
.then((d) => setMsg(d.message));
}, []);
return (
<div style={{ padding: 20 }}>
<h2>MERN Stack Test</h2>
<p>{msg}</p>
</div>
);
}
export default App;
Run the frontend:
npm run dev -- --host 0.0.0.0
Similar output:
VITE v7.3.1 ready in 252 ms
➜ Local: http://localhost:5173/
➜ Network: http://SERVER_IP:5173/
➜ press h + enter to show help
Open browser at http://SERVER_IP:5173.
Next Steps & Best Practices
- Environment Variables: Never commit secrets.
- Error Handling & Validation: Use middleware for robust APIs.
- Security: Sanitize inputs and configure HTTPS.
- Deployment: Consider Dockerizing each component.
- Scaling: For production MongoDB, explore Atlas or replica sets.
In this tutorial, we've learnt how to set up a MERN stack on Rocky Linux 10. With these steps, we’ve built a modern MERN stack on Rocky Linux 10, using the latest Node.js 24 LTS, MongoDB 8.x, and React 19. Happy coding—and here’s to building great applications together!
