slip NO 15 - msc-2 practical on full stack-2

Q1) Find an employee with a Salary greater than 25000 in the array (Using find by id method).

Steps:

1. Create an array of employee objects containing id, name, and salary fields.
2. Use the find() method to locate the first employee whose salary exceeds 25000.
3. Print the result to the console.

Code:

// Employee array
const employees = [
    { id: 1, name: 'Alice', salary: 20000 },
    { id: 2, name: 'Bob', salary: 30000 },
    { id: 3, name: 'Charlie', salary: 25000 },
];

// Find employee with salary greater than 25000
const employee = employees.find(emp => emp.salary > 25000);

if (employee) {
    console.log('Employee Found:', employee);
} else {
    console.log('No employee found with salary greater than 25000');
}

Execution:

1. Save the above code in a file named findEmployee.js.
2. Run the code using Node.js:

   
   node findEmployee.js
   

Expected Output:

Employee Found: { id: 2, name: 'Bob', salary: 30000 }

---

Q2) Create an Angular application that prints the names of students who got 85% using filter and map methods.

Steps:

1. Create a new Angular project.
2. Generate a new component to handle the student data.
3. Add an array of student objects with name and percentage fields in the component's .ts file.
4. Use the filter() and map() methods to process the array and extract the names of students scoring 85% or more.
5. Display the filtered names in the component's .html file.

---

Commands and Code:

1. Create a new Angular project:

   
   ng new StudentApp
   cd StudentApp
   

2. Generate a new component:

   
   ng generate component student
   

3. Modify the student.component.ts file:

   
   import { Component } from '@angular/core';
   
   @Component({
       selector: 'app-student',
       templateUrl: './student.component.html',
       styleUrls: ['./student.component.css']
   })
   export class StudentComponent {
       students = [
           { name: 'John', percentage: 82 },
           { name: 'Jane', percentage: 85 },
           { name: 'Emily', percentage: 90 },
           { name: 'Mark', percentage: 70 },
       ];
   
       filteredStudentNames = this.students
           .filter(student => student.percentage >= 85)
           .map(student => student.name);
   }
   

4. Modify the student.component.html file:

   
   <h2>Students with 85% or more:</h2>
   <ul>
       <li *ngFor="let name of filteredStudentNames">{{ name }}</li>
   </ul>
   

5. Run the Angular application:

   
   ng serve
   

6. Access the application in a browser: Open http://localhost:4200 to view the results.

---

Expected Output:

On the webpage:

Students with 85% or more:
- Jane
- Emily


===================================================================================





Steps to Develop the Application
Initialize a new Node.js project.
Install required dependencies.
Define an Express.js app with routes for Create and Update operations.
Use an in-memory array to store employee data (for simplicity).
Implement POST for Create and PUT for Update operations.
Test the application using tools like Postman or curl.
Code
Initialize the Project
Run these commands:

mkdir employeeApp
cd employeeApp
npm init -y
npm install express body-parser
Create the Application File
Save the following code in a file named app.js:

const express = require('express');
const bodyParser = require('body-parser');

const app = express();
const PORT = 3000;

// Middleware to parse JSON requests
app.use(bodyParser.json());

// In-memory storage for employees
let employees = [];

// Route to create an employee (POST /employees)
app.post('/employees', (req, res) => {
    const { id, name, salary } = req.body;

    // Check for required fields
    if (!id || !name || !salary) {
        return res.status(400).json({ message: 'All fields (id, name, salary) are required.' });
    }

    // Add the employee to the in-memory array
    const newEmployee = { id, name, salary };
    employees.push(newEmployee);

    res.status(201).json({ message: 'Employee created successfully', employee: newEmployee });
});

// Route to update an employee (PUT /employees/:id)
app.put('/employees/:id', (req, res) => {
    const { id } = req.params;
    const { name, salary } = req.body;

    // Find the employee by id
    const employee = employees.find(emp => emp.id === parseInt(id));

    if (!employee) {
        return res.status(404).json({ message: 'Employee not found' });
    }

    // Update employee details
    if (name) employee.name = name;
    if (salary) employee.salary = salary;

    res.status(200).json({ message: 'Employee updated successfully', employee });
});

// Start the server
app.listen(PORT, () => {
    console.log(`Server running on http://localhost:${PORT}`);
});
Testing the Application
Run the Server:

node app.js
The server will run at http://localhost:3000.
Test Create Operation:
Use Postman or curl to send a POST request to http://localhost:3000/employees with the following JSON body:

{
    "id": 1,
    "name": "Alice",
    "salary": 50000
}
Expected Response:

{
    "message": "Employee created successfully",
    "employee": {
        "id": 1,
        "name": "Alice",
        "salary": 50000
    }
}
Test Update Operation:
Send a PUT request to http://localhost:3000/employees/1 with the following JSON body:

{
    "name": "Alice Johnson",
    "salary": 55000
}
Expected Response:

{
    "message": "Employee updated successfully",
    "employee": {
        "id": 1,
        "name": "Alice Johnson",
        "salary": 55000
    }
}