1. A) Create a static website using HTM Create a static website using HTML tables Table.html Static Website with HTML Table

Sample Table

Header 1	Header 2	Header 3
Row 1, Cell 1	Row 1, Cell 2	Row 1, Cell 3
Row 2, Cell 1	Row 2, Cell 2	Row 2, Cell 3
Row 3, Cell 1	Row 3, Cell 2	Row 3, Cell 3

3.C. Implement Express.js, router // Filename - index.js // Importing express module const express = require("express") const app = express() // Handling GET / request app.use("/", (req, res, next) => { res.send("This is the express server") }) // Handling GET /hello request app.get("/hello", (req, res, next) => { res.send("This is the hello response"); }) // Server setup app.listen(3000, () => { console.log("Server is Running") }) OUTPUT Implement Router const http = require('http'); http.createServer(function (req, res) { res.writeHead(200, { 'Content-Type': 'text/html' }); const url = req.url; if (url === '/about') { res.write(' Welcome to about us page'); res.end(); } else if (url === '/contact') { res.write(' Welcome to contact us page'); res.end(); } else { res.write('Hello World!'); res.end(); } }).listen(3000, function () { console.log("server start at port 3000"); }); OUTPUT 1.B) Create a registration form using HTML forms Program steps: 1. Open notepad 2. Create tags – form and its attributes 3. Save as html file Form.html Registration Form

Registration Form

3 B. Implement file system in Node.js Program steps: ● Read files ● Create files ● Update files ● Delete files Rename files // filesystem.js const fs = require('fs'); const path = require('path'); // Define a sample file path const filePath = path.join(__dirname, 'example.txt'); // ------------------------------ // 1. CREATE a new file // ------------------------------ fs.writeFile(filePath, 'Hello, this is a new file!', (err) => { if (err) return console.error('Error creating file:', err); console.log(' ✅ File created successfully.'); // ------------------------------ // 2. READ the file // ------------------------------ fs.readFile(filePath, 'utf8', (err, data) => { if (err) return console.error('Error reading file:', err); console.log(' 📖 File content:', data); // ------------------------------ // 3. UPDATE the file (append text) // ------------------------------ fs.appendFile(filePath, '\nThis line was appended later.', (err) => { if (err) return console.error('Error updating file:', err); console.log(' ✏ File updated successfully.'); // ------------------------------ // 4. RENAME the file // ------------------------------ const newFilePath = path.join(__dirname, 'renamed_example.txt'); fs.rename(filePath, newFilePath, (err) => { if (err) return console.error('Error renaming file:', err); console.log(' 📝 File renamed successfully.'); // ------------------------------ // 5. DELETE the file // ------------------------------ fs.unlink(newFilePath, (err) => { if (err) return console.error('Error deleting file:', err); console.log(' 🗑 File deleted successfully.'); }); }); }); }); }); OUTPUT 2B. Develop a student registration form with Validation support using JavaScript. Program steps: Create an HTML page to create the form. CSS to design the layout of the form. JavaScript to validate the form. Form.html

REGISTRATION FORM

3aA. Deployment of Node.js and built-in Node.js modules // Load the HTTP module const http = require('http'); // Create an HTTP server http.createServer((req, res) => { res.writeHead(200, { 'Content-Type': 'text/html' }); // Get current date and time const currentDate = new Date(); // Send response res.write(`

The date and time are currently ${currentDate}

`); res.end(); }).listen(8080); console.log("Server running at http://localhost:8080/"); OUTPUT: 4b React Props Index.html

Main.jsx import { createRoot } from 'react-dom/client' function Car(props) { return (

I am a {props.brand}!

); } createRoot(document.getElementById('root')).render( ); OUTPUT React events Index.html

Main.jsx import { createRoot } from 'react-dom/client' function Football() { const shoot = () => { alert("Great Shot!"); } return ( ); } createRoot(document.getElementById('root')).render( ); OUTPUT React lists Index.html

Main.jsx import { createRoot } from 'react-dom/client' function MyCars() { const cars = ['Ford', 'BMW', 'Audi']; return ( <>

My Cars:

I am a { car }

); } createRoot(document.getElementById('root')).render( ); OUTPUT React forms Index.html

Main.jsx import { createRoot } from 'react-dom/client' function MyForm() { return ( ) } createRoot(document.getElementById('root')).render( ); OUTPUT React routers Index.html

Main.jsx import { createRoot } from 'react-dom/client'; import { BrowserRouter, Routes, Route, Link } from 'react-router-dom'; function Home() { return

Home Page

; } function About() { return

About Page

; } function Contact() { return

Contact Page

; } function App() { return ( {/* Navigation */} {/* Routes */} } /> } /> } /> ); } createRoot(document.getElementById('root')).render( ); OUTPUT 2.A) Develop dynamic Web content using JavaScript Program steps: ● Open an html page ● Reading: Dynamically displaying data ● Creating: Allow User Input ● Editing data before submit. ● Save the file as html Dynamic.html To create HTML dynamic pages

Dynamically changing content

Enter Your Name

2B. Develop a student registration form with Validation support using JavaScript. Program steps: Create an HTML page to create the form. CSS to design the layout of the form. JavaScript to validate the form. Form.html

REGISTRATION FORM

4a4A. Index.html

Missbrauch melden

PDF-Details

Kontaktdaten

rpkwt