Jassif Team Institution

// Example API endpoint
app.get('/api/products', (req, res) => {
  res.json([{ id: 1, name: 'Product' }]);
});

// Next.js page
export async function getServerSideProps() {
  const res = await fetch('https://api.example.com/data');
  return { props: { data: await res.json() } };
}

// Module Federation in webpack.config.js
new ModuleFederationPlugin({
  name: 'app1',
  filename: 'remoteEntry.js',
  exposes: { './Component': './src/Component' }
})

// Node.js backend (Express)
const express = require('express');
const cors = require('cors');
const app = express();

// Enable CORS for React frontend
app.use(cors());

app.get('/api/data', (req, res) => {
  res.json({ message: 'Hello from Node!' });
});

app.listen(8080, () => {
  console.log('Server running on port 8080');
});

// React frontend component
import { useState, useEffect } from 'react';

function App() {
  const [data, setData] = useState(null);
  const [loading, setLoading] = useState(true);

  useEffect(() => {
    fetch('http://localhost:8080/api/data')
      .then(res => res.json())
      .then(data => {
        setData(data);
        setLoading(false);
      });
  }, []);

  return (
    

      {loading ? 'Loading...' : data.message}
    
  );
}

// Node.js backend (Express)
const express = require('express');
const cors = require('cors');
const app = express();

app.use(cors());

app.get('/api/users', (req, res) => {
  res.json([
    { id: 1, name: 'John Doe' },
    { id: 2, name: 'Jane Smith' }
  ]);
});

app.listen(8080, () => {
  console.log('Server running on port 8080');
});

// Angular service (user.service.ts)
import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Observable } from 'rxjs';

interface User {
  id: number;
  name: string;
}

@Injectable({
  providedIn: 'root'
})
export class UserService {
  private apiUrl = 'http://localhost:8080/api/users';

  constructor(private http: HttpClient) { }

  getUsers(): Observable {
    return this.http.get(this.apiUrl);
  }
}

// Node.js backend (Express)
const express = require('express');
const cors = require('cors');
const app = express();

app.use(cors());

app.get('/api/products', (req, res) => {
  res.json([
    { id: 1, name: 'Product A', price: 29.99 },
    { id: 2, name: 'Product B', price: 49.99 }
  ]);
});

app.listen(8080, () => {
  console.log('Server running on port 8080');
});

// Vue.js component

// Node.js backend (Express)
const express = require('express');
const cors = require('cors');
const app = express();

app.use(cors());

app.get('/api/todos', (req, res) => {
  res.json([
    { id: 1, text: 'Learn Node.js', done: true },
    { id: 2, text: 'Learn Svelte', done: false },
    { id: 3, text: 'Build an app', done: false }
  ]);
});

app.listen(8080, () => {
  console.log('Server running on port 8080');
});



Todo List
{#if loading}
  
Loading...
{:else}
  

    {#each todos as todo (todo.id)}
      

         toggleTodo(todo.id)}
        />
        {todo.text}
      
    {/each}
  
{/if}

// Server-side with Socket.io
io.on('connection', (socket) => {
  socket.emit('message', 'Welcome!');
  socket.on('chatMessage', (msg) => {
    io.emit('message', msg);
  });
});

// Install required packages
npm install helmet cors express-rate-limit
  express-mongo-sanitize xss-clean hpp

// Basic security setup
app.use(helmet());
app.use(cors({ origin: process.env.FRONTEND_URL }));
app.use(express.json({ limit: '10kb' }));
app.use(mongoSanitize());
app.use(xss());

// .env.example
NODE_ENV=development
PORT=3000
MONGODB_URI=your_mongodb_uri
JWT_SECRET=your_jwt_secret
FRONTEND_URL=http://localhost:3000