Markup and Scripting Language Lab

Course Information

  • Semester:
  • Course Code:
  • Credits:
  • Course Teacher: Md Habibul Basar Faruq
  • Email: mh.faruq06@gmail.com

Course Description

This lab course provides hands-on experience in web technologies, focusing on HTML, CSS, JavaScript, and the Django web framework.
Students will learn to design, style, and script web pages, and later integrate them into dynamic, database-driven web applications using Django.

Weekly Lab Topics and Tasks

  • Week 1: Introduction to Markup and Scripting
    Understand markup vs scripting and basic HTML structure.
    Task: Create a simple HTML5 webpage using headings, paragraphs, images, and links.

  • Week 2: HTML Forms and Tables
    Learn to collect and display data using forms and tables.
    Task: Design a registration form and a data table with CSS borders and spacing.

  • Week 3: CSS Styling and Layout
    Apply design and layout principles to web pages.
    Task: Create external CSS, style forms and navigation bars, and explore Flexbox/Grid.

  • Week 4: Responsive Web Design
    Build mobile-friendly, responsive layouts.
    Task: Use CSS media queries to adjust page layout for different devices.

  • Week 5: JavaScript Fundamentals
    Learn JavaScript syntax, variables, conditions, and loops.
    Task: Write JS scripts for form validation and simple calculations.

  • Week 6: DOM Manipulation
    Dynamically modify webpage content.
    Task: Create an interactive to-do list or image slider using DOM methods.

  • Week 7: Introduction to Django Framework
    Set up the Django environment and basic project.
    Task: Install Django, create a project and app, and run the development server.

  • Week 8: Django Templates and Static Files
    Integrate HTML and CSS with Django templates.
    Task: Create a base template and use {% extends %}, {% block %}, and static files.

  • Week 9: Django Forms and User Input
    Capture and validate form data in Django.
    Task: Create a form using forms.py and handle POST requests.

  • Week 10: Database and Models
    Store and retrieve data from the Django database.
    Task: Create a model (e.g., Student or Product) and display database records dynamically.

  • Week 11: JavaScript and Django Integration
    Combine client-side and server-side interactivity.
    Task: Add JavaScript validation to Django forms or use AJAX for live updates.

  • Week 12: Django Authentication
    Implement login, logout, and registration functionality.
    Task: Use Django’s built-in authentication system and restrict access for users.

  • Week 13: Mini Project – Integration Project
    Combine all skills into a real-world project.
    Suggested Topics: Portfolio, Blog System, Student Management System, Product Catalog.
    Requirement: Use HTML, CSS, JS, Django templates, models, and database.

  • Week 14: Project Presentation and Viva
    Present and demonstrate final projects.
    Task: Explain implementation details, Django structure, and code functionality.

Course Credits

  • Instructor: Md Habibul Basar Faruq
  • Contact: mh.faruq06@gmail.com
  • Institution: BGC Trust University Bangladesh

Suggested References

Assessment & Evaluation

  • Weekly Lab Performance – 30%
  • Mini Project – 40%
  • Viva & Presentation – 30%

CATM:

  • Class Attendance Marks: