Tuesday, March 18, 2025

Software Development Handout for Beginers

 Day One: Introduction to Software Development & HTML Basics

1. What is Software Development?

Software development is the process of creating, designing, and maintaining software applications. It involves writing code, testing, and improving software to meet user needs.

👉 Example: Developing a mobile app, website, or computer program.

2. How Software Development Works

Software development follows a process called the Software Development Life Cycle (SDLC):

  1. Planning – Understanding the problem.
  2. Designing – Creating a blueprint (wireframe, UI design).
  3. Coding – Writing the actual program.
  4. Testing – Checking for errors (bugs).
  5. Deployment – Releasing the software for use.
  6. Maintenance – Updating and fixing issues.

3. Software Needed for Software Development

To start coding, you need:

  • Text Editor – VS Code, Sublime Text, Notepad++.
  • Web Browser – Chrome, Firefox.
  • Programming Languages – HTML, CSS, JavaScript.
  • Local Server (optional) – XAMPP for PHP projects.

4. Introduction to Websites Using Coding

A website is a collection of web pages displayed on the internet.
To create a website, we use:

  • HTML (HyperText Markup Language) – Structure
  • CSS (Cascading Style Sheets) – Styling
  • JavaScript – Interaction & Functionality

5. How to Create and Edit an HTML Page

🔹 Open Notepad or VS Code
🔹 Type the following HTML code:

html

CopyEdit

<!DOCTYPE html>

<html>

<head>

    <title>My First Web Page</title>

</head>

<body>

    <h1>Welcome to My Website</h1>

    <p>This is my first webpage.</p>

</body>

</html>

🔹 Save the file as index.html
🔹 Open it in a web browser.

6. Introduction to Tags and Elements

🔹 Tags: Keywords in HTML that define elements.
🔹 Elements: The content enclosed within tags.

👉 Example:

html

CopyEdit

<p>This is a paragraph.</p>

  • <p> is a tag
  • This is a paragraph. is the content
  • <p>...</p> forms an element

7. Basic HTML Structure

Every HTML page follows this structure:

html

CopyEdit

<!DOCTYPE html>

<html>

<head>

    <title>Page Title</title>

</head>

<body>

    <h1>Main Heading</h1>

    <p>Paragraph content.</p>

</body>

</html>

🔹 DOCTYPE – Declares HTML version.
🔹 <html> – The root of an HTML document.
🔹 <head> – Contains metadata & title.
🔹 <body> – Contains the visible content.

8. Difference Between a Tag and an Element

Feature

Tag

Element

Definition

An HTML keyword enclosed in < >

A tag with content inside

Example

<h1>

<h1>Heading</h1>

Types

Opening & Closing tags

Empty or Container elements

9. How to Write HTML Tags and Elements

🔹 Always use opening and closing tags (<tag>content</tag>)
🔹 Some tags don’t need closing (<br>, <img>).

Example:

html

CopyEdit

<h2>This is a heading</h2>

<img src="image.jpg" alt="My Image">

10. HTML Tags and Their Functionality

Tag

Function

<h1> - <h6>

Headings (Largest to Smallest)

<p>

Paragraph

<a href="#">

Hyperlink

<img src="path.jpg">

Image

<ul> <li>

Unordered List

<ol> <li>

Ordered List

<table>

Table Structure

Class Activities:

  1. Write & Save a simple HTML page.
  2. Identify different HTML tags in an example.
  3. Discuss how websites work using HTML.

Day Two: List Tags in HTML

1. Anchor Link (<a> Tag)

The anchor (<a>) tag is used to create hyperlinks in HTML.
Example:

html
CopyEdit
<a href="https://www.google.com">Visit Google</a>

🔹 href="URL" → Specifies the link destination.
🔹 Example (Linking to another page on your site):

html
CopyEdit
<a href="about.html">About Us</a>

🔹 Example (Link opening in a new tab):

html
CopyEdit
<a href="https://www.google.com" target="_blank">Visit Google</a>

2. Ordered List (<ol> Tag)

Ordered lists use numbers (1, 2, 3...) to arrange items.
Example:

html
CopyEdit
<ol>
    <li>Wake up</li>
    <li>Brush your teeth</li>
    <li>Have breakfast</li>
</ol>

🔹 <ol> → Defines the ordered list.
🔹 <li> → Represents a list item.

3. Unordered List (<ul> Tag)

Unordered lists use bullets (●, ○, ■) to arrange items.
Example:

html
CopyEdit
<ul>
    <li>Apples</li>
    <li>Oranges</li>
    <li>Bananas</li>
</ul>

🔹 <ul> → Defines the unordered list.
🔹 <li> → Represents a list item.

Day Three: Tables in HTML

1. What is a Table?

A table in HTML is used to display data in rows and columns.

2. Table Structure

Tables are created using:

  • <table> → Defines the table.
  • <tr> → Defines a table row.
  • <th> → Defines table headers (bold).
  • <td> → Defines table data (regular cells).

3. How to Use Tables in a Webpage

Example:

html
CopyEdit
<table border="1">
    <tr>
        <th>Name</th>
        <th>Age</th>
    </tr>
    <tr>
        <td>Alice</td>
        <td>12</td>
    </tr>
    <tr>
        <td>Bob</td>
        <td>14</td>
    </tr>
</table>

🔹 border="1" → Adds a visible border.
🔹 <th> → Creates bold headers.
🔹 <td> → Adds normal table data.


[4/4, 3:12 PM] raheemnobigdeal: How to Use Tables in a Webpage

Example:


html

CopyEdit

<table border="1">

    <tr>

        <th>Name</th>

        <th>Age</th>

    </tr>

    <tr>

        <td>Alice</td>

        <td>12</td>

    </tr>

    <tr>

        <td>Bob</td>

        <td>14</td>

    </tr>

</table>

🔹 border="1" → Adds a visible border.

🔹 <th> → Creates bold headers.

🔹 <td> → Adds normal table data.

[4/4, 3:12 PM] raheemnobigdeal: Day One: Advanced Tables in HTML

1. Designing Tables

Tables can be styled with CSS to improve their appearance.


🔹 Basic Table Design:


html

CopyEdit

<style>

    table {

        width: 80%;

        border-collapse: collapse;

    }

    th, td {

        border: 1px solid black;

        padding: 10px;

        text-align: center;

    }

    th {

        background-color: lightgray;

    }

</style>

 

<table>

    <tr>

        <th>Name</th>

        <th>Age</th>

        <th>Country</th>

    </tr>

    <tr>

        <td>Alice</td>

        <td>25</td>

        <td>USA</td>

    </tr>

    <tr>

        <td>Bob</td>

        <td>30</td>

        <td>UK</td>

    </tr>

</table>

[4/4, 3:13 PM] raheemnobigdeal: 2. Table Layout

Merging Cells (colspan and rowspan)

html

CopyEdit

<tr>

    <td colspan="2">Merged Cell</td>

</tr>

Adding Padding & Borders in CSS

Using Tables for Layouts (Not Recommended in Modern Web Design)

[4/4, 3:18 PM] raheemnobigdeal: Day Two: Forms in HTML

1. What is a Form?

Forms allow users to input data, which can be sent to a server.


2. How to Use Forms

A form is created using the <form> tag.

Basic Example:


html

CopyEdit

<form action="submit.php" method="post">

    <label>Name:</label>

    <input type="text" name="name"><br>

    <label>Email:</label>

    <input type="email" name="email"><br>

    <input type="submit" value="Submit">

</form>

3. Advanced Forms

🔹 Using Checkboxes & Radio Buttons


html

CopyEdit

<label>Gender:</label>

<input type="radio" name="gender" value="male"> Male

<input type="radio" name="gender" value="female"> Female

🔹 Dropdown List (<select> Tag)


html

CopyEdit

<select>

    <option value="html">HTML</option>

    <option value="css">CSS</option>

</select>

🔹 Textarea for Messages


html

CopyEdit

<textarea rows="4" cols="50" name="message">

[4/4, 3:28 PM] raheemnobigdeal: Project 1: Design a simple layout using HTML & CSS.


Project 2: Create a form using table layout.

[4/4, 3:35 PM] raheemnobigdeal: A table is a way of organizing information in a neat and structured manner. It consists of rows (horizontal lines), columns (vertical lines), and cells (small boxes inside the table). For example, when we want to list our classmates' names and ages, we can arrange them inside a table. By using tables, we can easily see and compare information. To help pupils understand better, the teacher can draw a simple table on the board and let the pupils fill in their names, ages, and classes.


A form, on the other hand, is a document used to collect information. We often use forms when we register for school, join a club, or sign up for an event. Forms usually have blank spaces where we fill in our names, ages, and other details. To make the lesson fun, the teacher can draw a simple form on the board, such as a "School Registration Form," and ask pupils to fill in their details. This helps them understand how forms work and why they are important.




Day Four: Free Day – Project 1

🎯 Task:
Create a simple webpage using HTML.

✅ Requirements:

  • A heading (<h1>)
  • A paragraph (<p>)
  • A list (<ul> or <ol>)
  • A link (<a> tag)

Week Two Lesson Plan: HTML & CSS

Day One: Advanced Tables in HTML

1. Designing Tables

Tables can be styled with CSS to improve their appearance.

🔹 Basic Table Design:

html
CopyEdit
<style>
    table {
        width: 80%;
        border-collapse: collapse;
    }
    th, td {
        border: 1px solid black;
        padding: 10px;
        text-align: center;
    }
    th {
        background-color: lightgray;
    }
</style>
 
<table>
    <tr>
        <th>Name</th>
        <th>Age</th>
        <th>Country</th>
    </tr>
    <tr>
        <td>Alice</td>
        <td>25</td>
        <td>USA</td>
    </tr>
    <tr>
        <td>Bob</td>
        <td>30</td>
        <td>UK</td>
    </tr>
</table>

2. Table Layout

  • Merging Cells (colspan and rowspan)
html
CopyEdit
<tr>
    <td colspan="2">Merged Cell</td>
</tr>
  • Adding Padding & Borders in CSS
  • Using Tables for Layouts (Not Recommended in Modern Web Design)

Day Two: Forms in HTML

1. What is a Form?

Forms allow users to input data, which can be sent to a server.

2. How to Use Forms

A form is created using the <form> tag.
Basic Example:

html
CopyEdit
<form action="submit.php" method="post">
    <label>Name:</label>
    <input type="text" name="name"><br>
    <label>Email:</label>
    <input type="email" name="email"><br>
    <input type="submit" value="Submit">
</form>

3. Advanced Forms

🔹 Using Checkboxes & Radio Buttons

html
CopyEdit
<label>Gender:</label>
<input type="radio" name="gender" value="male"> Male
<input type="radio" name="gender" value="female"> Female

🔹 Dropdown List (<select> Tag)

html
CopyEdit
<select>
    <option value="html">HTML</option>
    <option value="css">CSS</option>
</select>

🔹 Textarea for Messages

html
CopyEdit
<textarea rows="4" cols="50" name="message">Write something here...</textarea>

Lecture 3 Introduction to CSS

✅ 1. Introduction to CSS

✳️ What is CSS?

CSS stands for Cascading Style Sheets.
It is a language used to style HTML pages — that means you use it to add colors, fonts, layouts, borders, spacing, etc. to your website.

🔍 Why use CSS?

  • To make websites look beautiful and organized
  • To separate content (HTML) from design (CSS)
  • To save time by reusing styles across multiple pages

📌 Without CSS, your website will just look like plain black and white text.

 

✅ 2. Types of CSS

There are three main types of CSS:

1️⃣ Inline CSS

CSS written inside an HTML element using the style attribute.

html

CopyEdit

<p style="color: red;">This is red text.</p>

2️⃣ Internal CSS

CSS written inside the <style> tag in the HTML file's <head> section.

html

CopyEdit

<head>

  <style>

    p {

      color: blue;

    }

  </style>

</head>

3️⃣ External CSS

CSS is written in a separate .css file and linked to the HTML using a <link> tag.

html

CopyEdit

<!-- In the HTML file -->

<head>

  <link rel="stylesheet" href="styles.css">

</head>

css

CopyEdit

/* In styles.css */

p {

  color: green;

}

✅ External CSS is the most recommended for big projects because it keeps code clean, organized, and reusable.

 

✅ 3. CSS Selectors

Selectors are used to target HTML elements so you can apply styles to them.

✳️ Common Selectors:

Selector Type

Example

Targets

Element

p

All <p> tags

Class

.box

All elements with class="box"

ID

#main

Element with id="main"

Grouping

h1, p

All <h1> and <p>

Descendant

div p

All <p> inside a <div>

Example:

css

CopyEdit

h1 {

  color: purple;

}

 

.box {

  border: 1px solid black;

}

 

#main {

  background-color: yellow;

}

 

✅ 4. External CSS Practice Example

Let’s create a simple webpage styled with external CSS.

🗂 Files you'll need:

  • index.html
  • style.css

 

📄 index.html

html

CopyEdit

<!DOCTYPE html>

<html>

<head>

  <title>My CSS Page</title>

  <link rel="stylesheet" href="style.css">

</head>

<body>

 

  <h1>Welcome to My Website</h1>

  <p class="intro">This is a sample paragraph styled with CSS.</p>

  <div id="main">

    <p>This is inside the main section.</p>

  </div>

 

</body>

</html>

 

🎨 style.css

css

CopyEdit

/* style.css file */

 

body {

  font-family: Arial, sans-serif;

  background-color: #f0f0f0;

}

 

h1 {

  color: darkblue;

  text-align: center;

}

 

.intro {

  color: green;

  font-size: 18px;

}

 

#main {

  background-color: white;

  border: 2px solid #ccc;

  padding: 10px;

}

 

Week Three Lesson Plan: Advanced HTML & CSS

Day One: Advanced Attributes in HTML & CSS

1. Introduction to Attributes and Values

Attributes provide additional information about HTML elements.
🔹 Example:

html
CopyEdit
<img src="image.jpg" alt="Sample Image">
<a href="https://www.google.com" target="_blank">Visit Google</a>
  • src: Specifies the image source.
  • alt: Alternative text for images.
  • href: Defines the link URL.
  • target="_blank": Opens the link in a new tab.

2. Typesetting in CSS

CSS provides properties for text styling:
🔹 Example:

css
CopyEdit
h1 {
    font-family: Arial, sans-serif;
    font-size: 24px;
    font-weight: bold;
    text-align: center;
    text-transform: uppercase;
}

3. Color in CSS

Colors can be added using names, HEX, RGB, or HSL.
🔹 Example:

css
CopyEdit
p { color: red; } /* Named color */
p { color: #ff0000; } /* HEX color */
p { color: rgb(255, 0, 0); } /* RGB */

4. Background Color and Image

🔹 Example:

css
CopyEdit
body {
    background-color: lightblue;
    background-image: url("background.jpg");
    background-size: cover;
}

Day Two: Borders, Margins, and Padding in CSS

1. What is a Border?

A border surrounds an element.
🔹 Example:

css
CopyEdit
div {
    border: 2px solid black;
    border-radius: 10px;
}

2. What is Padding?

Padding is the space inside an element, between the content and the border.
🔹 Example:

css
CopyEdit
div {
    padding: 20px;
    background-color: lightgray;
}

3. What is Margin?

Margin is the space outside an element, creating distance from others.
🔹 Example:

css
CopyEdit
div {
    margin: 30px;
}

Day Three: Forms with Class and ID Selectors

1. Introduction to Class and ID Selectors

🔹 Class Selector: Applied to multiple elements.

css
CopyEdit
.form-input {
    border: 1px solid blue;
    padding: 5px;
}
html
CopyEdit
<input type="text" class="form-input">

🔹 ID Selector: Unique to one element.

css
CopyEdit
#submit-btn {
    background-color: green;
    color: white;
}
html
CopyEdit
<button id="submit-btn">Submit</button>

2. Form Attributes and Values

🔹 Common Attributes:

  • action: Defines where form data is sent.
  • method: Specifies HTTP method (GET or POST).
  • required: Makes input mandatory.

🔹 Example:

html
CopyEdit
<form action="submit.php" method="post">
    <input type="text" placeholder="Enter name" required>
    <button type="submit">Submit</button>
</form>

 

Week Four Lesson Plan: Introduction to JavaScript

Day One: JavaScript Basics

1. Introduction to JavaScript

JavaScript is a programming language used to make web pages interactive.
🔹 Example:

<script>
    alert("Welcome to JavaScript!");
</script>

2. How to Use JavaScript with HTML

JavaScript can be added inside an HTML file using:

  • Inline JavaScript: 
<button onclick="alert('Button Clicked!')">Click Me</button>
  • Internal JavaScript: 
html
CopyEdit
<script>
    document.write("Hello, JavaScript!");
</script>
  • External JavaScript: 
html
CopyEdit
<script src="script.js"></script>

3. Types of Rules in JavaScript

  • Syntax Rules: How JavaScript should be written.
  • Variable Naming Rules: Cannot start with a number.
  • Operators Rules: +, -, *, /, etc.

4. Variable Declaration and Assigning

🔹 Using var, let, and const:

var name = "John";  // Old way
let age = 25;       // Modern way
const PI = 3.14;    // Cannot be changed

5. Introduction to Functions

Functions allow us to reuse code.
🔹 Example:

js
CopyEdit
function greet() {
    alert("Hello, welcome!");
}

6. How Functions Work

Functions must be called to execute.
🔹 Example:

function addNumbers(a, b) {
    return a + b;
}
console.log(addNumbers(5, 3));  // Output: 8

Day Two: Conditional Statements & Loops

1. IF Statement

Used to check conditions.
🔹 Example:

let age = 18;
if (age >= 18) {
    console.log("You are an adult.");
} else {
    console.log("You are underage.");
}

2. For Loop

Repeats code a fixed number of times.
🔹 Example:

for (let i = 0; i < 5; i++) {
    console.log("Number: " + i);
}

3. While Loop

Repeats code while a condition is true.
🔹 Example:

let num = 1;
while (num <= 5) {
    console.log(num);
    num++;
}

4. Do...While Loop

Executes at least once before checking the condition.
🔹 Example:

js
CopyEdit
let x = 1;
do {
    console.log("Value: " + x);
    x++;
} while (x <= 3);

Day Three: Arrays in JavaScript

1. What is an Array?

An array is a list that stores multiple values.
🔹 Example:

js
CopyEdit
let fruits = ["Apple", "Banana", "Cherry"];
console.log(fruits);

2. Creating Arrays

Arrays can be created using square brackets [].

3. How to Assign a Value to an Array

let colors = [];
colors[0] = "Red";
colors[1] = "Blue";
console.log(colors);

4. Accessing Array Values

let cars = ["Toyota", "Ford", "BMW"];
console.log(cars[1]);  // Output: Ford

5. Adding Items to an Array

js
CopyEdit
let students = ["Alice", "Bob"];
students.push("Charlie");  // Adds to end
console.log(students);

6. Removing Items from an Array

js
CopyEdit
students.pop();  // Removes last item
console.log(students);

7. Finding Items in an Array

js
CopyEdit
console.log(students.indexOf("Alice"));  // Output: 0

8. Merging Arrays

js
CopyEdit
let boys = ["John", "Mike"];
let girls = ["Sara", "Anna"];
let allStudents = boys.concat(girls);
console.log(allStudents);

 

Week Five Lesson Plan: Objects & DOM in JavaScript

Day One: Objects in JavaScript

1. What is an Object in JavaScript?

An object in JavaScript is a collection of key-value pairs. Objects store data and functions (called methods).

🔹 Example of an Object:

let student = {

    name: "John",
    age: 20,
    course: "Computer Science"
};
console.log(student.name);  // Output: John

2. How Objects Work in JavaScript

  • Objects store multiple related data.
  • Values are accessed using dot notation (.) or bracket notation ([]).

🔹 Example:

let car = {
    brand: "Toyota",
    model: "Camry",
    year: 2022
};
console.log(car["model"]);  // Output: Camry

3. Some Pre-defined JavaScript Objects

JavaScript has built-in objects such as:
✅ Math Object – Used for mathematical operations.
✅ String Object – Handles text.
✅ Array Object – Works with lists of data.

🔹 Example using Math Object:

console.log(Math.sqrt(25));  // Output: 5
console.log(Math.random());  // Generates a random number

4. Date Object in JavaScript

The Date object handles time and dates.

🔹 Example:

js
CopyEdit
let today = new Date();
console.log(today);  // Displays current date and time
console.log(today.getFullYear());  // Gets the current year

Day Two: DOM & Events in JavaScript

1. What is the DOM? (Document Object Model)

The DOM represents the structure of an HTML page and allows JavaScript to interact with it.

🔹 Example of DOM Manipulation:

document.getElementById("demo").innerHTML = "Hello, DOM!";

👉 This code changes the text inside an HTML element with id="demo".

🔹 Example HTML Code:

html
CopyEdit
<p id="demo">Original Text</p>
<button onclick="changeText()">Click Me</button>
 
<script>
    function changeText() {
        document.getElementById("demo").innerHTML = "Text Changed!";
    }
</script>

2. JavaScript Events

Events allow JavaScript to respond to user actions like clicking a button or pressing a key.

Common JavaScript Events:

✅ onclick – Runs when a button is clicked.
✅ onmouseover – Runs when the mouse hovers over an element.
✅ onchange – Runs when an input field changes.

🔹 Example using onclick Event:

<button onclick="alert('Button Clicked!')">Click Me</button>

🔹 Example using onmouseover Event:

<p onmouseover="this.style.color='red'">Hover over me</p>

 

Week Six Lesson Plan: Python Basics

Day One: Introduction to Python Programming

1. Introduction to Computer Programming

  • Computer programming is the process of writing instructions for a computer to execute.
  • A program is written using a programming language like Python.

2. Installation of Python

  • Download Python from python.org.
  • Install Python and set up IDLE or VS Code for writing Python programs.
  • Verify installation using: 
sh
CopyEdit
python --version

3. Syntax of a Computer Programming Language

  • Syntax refers to the rules that define the structure of code.
  • Example: Python requires indentation to define code blocks.

🔹 Correct Python Syntax:

print("Hello, Python!")

🔹 Incorrect Syntax (Missing Indentation):

def greet():
print("Hello")  # ❌ Error: Expected indentation

4. Introduction to Python

  • Python is easy to read and widely used for web development, data science, and automation.
  • Example of a simple Python program: 
python
CopyEdit
name = "John"
print("Hello, " + name)

Day Two: Python Basics

1. Variables in Python

  • A variable stores data.
  • Example: 
python
CopyEdit
age = 25
name = "Alice"
print(name, "is", age, "years old.")

2. Variable Declaration and Assigning

  • Variables do not require a type declaration in Python.
  • Example: 
python
CopyEdit
x = 5       # Integer
y = "Hello" # String
z = 3.14    # Float

3. Data Types in Python

Python has different types of data:
✅ int – Numbers (e.g., 10, 20)
✅ float – Decimal numbers (e.g., 3.14, 2.5)
✅ str – Text (e.g., "Hello", 'Python')
✅ bool – Boolean (True, False)

🔹 Example:

a = 10         # Integer
b = 3.14       # Float
c = "Python"   # String
d = True       # Boolean

4. Operators in Python

Operators are symbols used for calculations and logic.

🔹 Arithmetic Operators:

x = 10 + 5  # Addition
y = 10 - 5  # Subtraction
z = 10 * 2  # Multiplication
w = 10 / 2  # Division

🔹 Comparison Operators:

print(10 > 5)   # True
print(10 == 5)  # False
print(10 != 5)  # True

🔹 Logical Operators:

print(True and False)  # False
print(True or False)   # True

5. Python Tokens

Tokens are smallest units in Python. They include:
✅ Keywords – Reserved words (if, while, return)
✅ Identifiers – Variable & function names (age, print)
✅ Literals – Fixed values (10, "Hello")
✅ Operators – +, -, *, /

6. Python Keywords

Some important Python keywords:
if, else, for, while, break, continue, def, return, import, True, False

7. Python Identifiers

  • Identifiers are names for variables, functions, and classes.
  • Rules:
    ✅ Must start with a letter or underscore (_name, age)
    ✅ Cannot be a keyword (if, while are NOT allowed)

Day Three: Data Types in Python

1. Literals in Python

Literals are constant values assigned to variables.
✅ Numeric Literals: 10, 3.14
✅ String Literals: "Python", 'Hello'
✅ Boolean Literals: True, False

🔹 Example:

x = 25      # Integer literal
y = 3.14    # Float literal
z = "Hello" # String literal
a = True    # Boolean literal

2. Strings in Python

A string is a sequence of characters enclosed in quotes.

text = "Hello, Python!"
print(text)

3. Data Structures in Python

Python has different data structures for storing data:
✅ List – Ordered, changeable, allows duplicates ([1, 2, 3])
✅ Tuple – Ordered, unchangeable ((1, 2, 3))
✅ Set – Unordered, no duplicates ({1, 2, 3})
✅ Dictionary – Key-value pairs ({"name": "John", "age": 25})

4. Tuples in Python

  • Tuples are immutable (cannot be changed).
  • Example: 
my_tuple = (10, 20, 30)
print(my_tuple[1])  # Output: 20

 

Week Eight Lesson Plan: Python Functions, Data Structures, and OOP

Day One: Functions in Python

1. What is a Function?

  • A function is a block of reusable code that performs a task.
  • Functions help avoid repetition and make programs organized.

2. How to Define and Use Functions

Creating a Function

  • Use the def keyword.
  • Example: 
def greet():
    print("Hello, welcome to Python!")
 
greet()  # Calling the function

Function with Parameters

  • Parameters allow functions to accept inputs.
  • Example: 
python
CopyEdit
def add_numbers(a, b):
    return a + b
 
result = add_numbers(5, 10)
print("Sum:", result)  # Output: 15

Function with Default Parameters

  • Default values can be assigned to parameters.
  • Example: 
python
CopyEdit
def greet(name="User"):
    print("Hello, " + name + "!")
 
greet()         # Output: Hello, User!
greet("Alice")  # Output: Hello, Alice!

Returning Values from a Function

  • Functions can return results instead of printing them.
  • Example: 
def multiply(x, y):
    return x * y
 
product = multiply(4, 5)
print("Product:", product)  # Output: 20

Day Two: Python Data Structures

1. Lists in Python

  • Lists are ordered and mutable (can be changed).
  • Example: 
fruits = ["Apple", "Banana", "Cherry"]
print(fruits[1])  # Output: Banana
fruits.append("Mango")  # Adding an item
print(fruits)

2. Dictionaries in Python

  • A dictionary stores key-value pairs.
  • Example: 
student = {
    "name": "John",
    "age": 20,
    "course": "Python"
}
print(student["name"])  # Output: John

3. Sets in Python

  • Sets are unordered and do not allow duplicates.
  • Example: 
 
numbers = {1, 2, 3, 3, 4}
print(numbers)  # Output: {1, 2, 3, 4}
numbers.add(5)
print(numbers)

Day Three: Object-Oriented Programming (OOP) in Python

1. What is an Object?

  • An object is a real-world entity with attributes (data) and methods (functions).
  • Example: A Car object has:
    • Attributes: color, model, speed
    • Methods: start(), brake(), accelerate()

2. How to Create an Object?

  • Objects are created from classes.
  • Example: 
class Car:
    pass
 
my_car = Car()  # Creating an object
print(type(my_car))  # Output: <class '__main__.Car'>

3. What is a Class?

  • A class is a blueprint for creating objects.
  • Example: 
python
CopyEdit
class Car:
    def __init__(self, model, color):
        self.model = model
        self.color = color
 
my_car = Car("Toyota", "Red")
print(my_car.model)  # Output: Toyota

4. How to Create a Class?

  • Use the class keyword.
  • Example: 
class Person:
    def __init__(self, name, age):
        self.name = name
        self.age = age
 
person1 = Person("Alice", 25)
print(person1.name)  # Output: Alice

5. Object and Parameters

  • Objects can have attributes (variables) and methods (functions).
  • Example: 
class Dog:
    def __init__(self, name, breed):
        self.name = name
        self.breed = breed
    
    def bark(self):
        print(self.name + " is barking!")
 
my_dog = Dog("Buddy", "Labrador")
my_dog.bark()  # Output: Buddy is barking!

6. Creating a Class with a Constructor (__init__ method)

  • The __init__ method initializes an object's attributes.
  • Example: 
class Student:
    def __init__(self, name, grade):
        self.name = name
        self.grade = grade
 
    def show_info(self):
        print(f"Student: {self.name}, Grade: {self.grade}")
 
student1 = Student("John", "A")
student1.show_info()  # Output: Student: John, Grade: A

7. Inheritance in Python

  • Inheritance allows one class to inherit attributes and methods from another class.
  • Example: 
class Animal:
    def __init__(self, name):
        self.name = name
 
    def speak(self):
        print(f"{self.name} makes a sound.")
 
class Dog(Animal):
    def speak(self):
        print(f"{self.name} barks.")
 
my_dog = Dog("Rex")
my_dog.speak()  # Output: Rex barks.

 

Week Nine Lesson Plan: Introduction to Django

Day One: Introduction to Django

1. What is a Web Framework?

  • A web framework is a tool that helps developers build web applications quickly and efficiently.
  • It provides pre-built modules to handle common tasks like URL routing, database management, and authentication.

2. Why Django Web Framework?

Django is a high-level Python web framework that allows for rapid development and clean, pragmatic design.

  • Fast Development – Comes with built-in features like authentication, database integration, and admin panel.
  • Security – Protects against common attacks like SQL injection and cross-site scripting (XSS).
  • Scalability – Used by large websites like Instagram and Pinterest.

3. Installing Django

Before installing Django, ensure Python and pip are installed.

Install Django using pip

pip install django

4. Checking Django Version

After installation, confirm Django is installed by running:

django-admin --version

Day Two: Setting Up Requirements

1. Downloading or Upgrading Python

sh
CopyEdit
sudo apt update && sudo apt upgrade python3
  • On Windows, install from the official installer.

2. Checking Python Version

Run the following command to check the installed Python version:

sh
CopyEdit
python --version

3. Installing Pip (Python Package Manager)

  • Pip is used to install Python packages.
  • Check if pip is installed: 
sh
CopyEdit
pip --version
  • If pip is not installed, install it using: 
python -m ensurepip --default-pip

4. Choosing a Code Editor

Some recommended code editors for Django development:

  • VS Code – Lightweight, feature-rich, and supports Django.
  • PyCharm – Has built-in Django support.
  • Sublime Text – A minimal, fast editor with Python plugins.

Day Three: Creating the First Django App

1. How to Create Directories

  • Open the terminal and navigate to the desired folder.
  • Use mkdir to create a directory: 
mkdir my_django_project
cd my_django_project

2. Navigating to Directories

Use the cd command to move into the directory:

cd my_django_project

3. Creating a Virtual Environment

A virtual environment isolates dependencies for a Django project.

  • Create a virtual environment: 
python -m venv myenv

4. Activating the Virtual Environment

  • Windows: 
myenv\Scripts\activate
  • Mac/Linux: 
source myenv/bin/activate

5. Installing Django in the Virtual Environment

Once the virtual environment is activated, install Django:

pip install django
at March 18, 2025

0 comments:

Post a Comment

Subscribe to: Post Comments (Atom)
 

BEST COMPUTER GUIDE Written by Abigail Odenigbo, Published @ 2014 by NOBIGDEAL(Ipietoon)