A complete collection of Web Design and Development practical programs for B.Sc. Information Technology (Second Year). This repository follows the prescribed practical syllabus and contains well-structured source code, outputs, and examples to help students understand both client-side and server-side web development.
- Course: Web Design and Development Laboratory
- Program: B.Sc. Information Technology (Second Year)
- Language/Technologies: HTML5, CSS3, PHP, MySQL
- IDE: Visual Studio Code
- Server: XAMPP / WAMP
- Database: MySQL
- Create a simple web page using HTML.
- Use headings, paragraphs, text formatting, lists, tables, hyperlinks, and images.
- HTML Structure
- Text Formatting
- Lists
- Hyperlinks
- Images
- Tables
- Create a Contact Form using HTML.
- Embed Audio and Video using HTML5.
- Forms
- Input Controls
- Radio Buttons
- Checkboxes
- Textarea
- File Upload
- Audio
- Video
- Working with CSS for styling: Apply inline, internal and external CSS, Style text, backgrounds and borders.
- Building a web page layout using CSS: Use positioning techniques (relative, absolute, fixed) and the box model.
- Designing a multi-page website: use navigation links between pages (e.g., Home, About, Contact)
- CSS Selectors
- Box Model
- Positioning
- Navigation Bar
- Layout Design
- Intro to JavaScript Programming: basic arithmetic operations, alerts and console logging.
- Form validation using JavaScript: validate required fields, check for email format, and password length.
- JavaScript events and Interactivity: implement onClick, onMouseOver and onChange events with buttons and inputs.
- Variables
- Operators
- Loops
- Conditional Statements
- Functions
- DOM Manipulation
- Events
- Display dynamic content using variables and control structures.
- Retrieve form data using GET and POST methods.
- PHP Syntax
- Variables
- if-else
- switch
- Loops
- GET Method
- POST Method
- Store and retrieve data using Arrays.
- Create User-defined Functions.
- Indexed Arrays
- Associative Arrays
- foreach Loop
- Functions
- Function Parameters
- Return Values
- Perform file operations using PHP.
- Create Files
- Read Files
- Write Files
- Append Data
- File Handling Functions
- Connect PHP with MySQL.
- Display records from the database.
- mysqli_connect()
- Database Connection
- SELECT Query
- HTML Table Display
- Insert records into MySQL.
- Update existing records.
- Delete records.
- INSERT
- UPDATE
- DELETE
- HTML Forms
- PHP + MySQL
- Build a Login System using PHP & MySQL.
- User Authentication
- Sessions
- Cookies
- Login
- Logout
- Remember Me
- HTML5
- CSS3
- JavaScript
- PHP
- MySQL
- XAMPP
- WAMP
- Visual Studio Code
Web-Design-and-Development-Lab
│
├── Practical-01
├── Practical-02
├── Practical-03
├── Practical-04
├── Practical-05
├── Practical-06
├── Practical-07
├── Practical-08
├── Practical-09
├── Practical-10
│
├── README.md
└── LICENSE
- Clone this repository
git clone https://github.com/your-username/Web-Design-and-Development-Lab.git-
Open the project in Visual Studio Code
-
For HTML/CSS/JavaScript practicals:
- Open
index.html - Run using Live Server
- Open
-
For PHP practicals:
- Install XAMPP or WAMP
- Start Apache & MySQL
- Copy project into:
htdocs(XAMPP)www(WAMP)
- Import the required MySQL database.
- Open the project in your browser.
After completing these practicals, students will be able to:
- Design webpages using HTML5.
- Style webpages using CSS3.
- Create responsive layouts.
- Develop interactive web pages using JavaScript.
- Build dynamic websites using PHP.
- Connect PHP applications with MySQL.
- Perform CRUD operations.
- Develop authentication systems using Sessions and Cookies.
- Visual Studio Code
- XAMPP / WAMP
- PHP 8+
- MySQL
- Modern Web Browser
Aditya Nanaware
Assistant Professor
Department of Information Technology
If this repository helps you in learning Web Design and Development, consider giving it a ⭐ Star on GitHub.
Happy Coding! 🚀