WSL

4 🧩 Backend

🎯 Syfte

Skapa ett backend-API i Node.js/Express som erbjuder en enkel kalkylatorlogik via REST. API:t körs i en Docker-container och är redo att integreras med frontend-tjänsten.


📁 Strukturen i backend/

backend/
├── Dockerfile
├── package.json
├── server.js

🛠️ Steg 1: Initiera Node-projekt

cd backend
npm init -y
npm install express cors

🧮 Steg 2: Skriv serverkoden i server.js

const express = require('express');
const cors = require('cors');
const app = express();
const port = 5000;

app.use(cors());

function calculate(op, a, b) {
  a = parseFloat(a);
  b = parseFloat(b);
  switch(op) {
    case 'add': return a + b;
    case 'sub': return a - b;
    case 'mul': return a * b;
    case 'div': return b !== 0 ? a / b : 'NaN';
    default: return null;
  }
}

app.get('/calc/:op', (req, res) => {
  const { op } = req.params;
  const { a, b } = req.query;
  const result = calculate(op, a, b);
  res.json({ result });
});

app.listen(port, () => {
  console.log(`API körs på http://localhost:${port}`);
});

🐳 Steg 3: Dockerfile för backend

# backend/Dockerfile
FROM node:18-alpine
WORKDIR /app
COPY package*.json ./
RUN npm install
COPY . .
EXPOSE 5000
CMD ["node", "server.js"]

🔗 Steg 4: Lägg till backend i docker-compose.yml

Redigera calc-project/docker-compose.yml:

version: '3'
services:
  frontend:
    build: ./frontend
    ports:
      - "3000:3000"
    restart: always

  backend:
    build: ./backend
    ports:
      - "5000:5000"
    restart: always

🔧 Steg 5: Kör hela systemet

Starta båda tjänsterna:

docker-compose up --build

Besök sedan: Frontend: http://localhost:3000 Backend (API-test): http://localhost:5000/calc/add?a=3\&b=4


🧪 Övning – Testa hela flödet

  1. Starta docker-compose up

  2. I frontend: mata in tal och välj operator – du bör få svar från backend.

  3. Testa API\:t direkt i webbläsaren eller med curl:

    curl "http://localhost:5000/calc/mul?a=5&b=8"
  4. Committa dina ändringar:

git add .
git commit -m "Lägg till backend med Express och koppla till frontend"
git push