Lesson 10 (Computing)
Lesson 10 (Computing)
Lesson 10 (Computing)
Introduction to Programming
Topics to be discussed:
1. Programming languages
2. Program development life cycle
3. Algorithms and data structures
4. Flow charts
5. Web design using Hypertext Mark up language (HTML)
6. Practical knowledge of BASIC and HTML programming languages
Objectives
By the end of this lesson, the student should be able to:
1. Explain programming language
2. Identify the categories of programming languages
3. Describe the features of particular Programming language
4. Explain common terminologies associated with programming
5. State the basic steps involved in the development of a computer program
6. Explain the concepts of algorithm
7. Explain the concepts of flow chat
Introduction
This lesson is an introduction to computer programming, the process of writing instructions that
direct the computer to carry out a specific task.
Basic concepts of computer programming include problem statements, algorithms, coding,
control structures, testing, and documentation.
Additional lesson topics include characteristics of computer programming languages and brief
descriptions of todays most popular programming languages.
Programming language enable a programmer to precisely specify what data a computer will act
upon, how these data will be stored/transmitted, and precisely what actions to take under various
circumstances.
There are different types of programming languages that can be used to create programs, but
regardless of what language you use, these instructions are translated into machine language that
can be understood by computers.
Each assembly instruction is translated into one machine instruction by an assembler program.
For example, C++ can be described as high level, object oriented, complied language.
When you need to select a language to use for a program, it is useful to understand some of the
general characteristics of programming language.
Procedural
Languages with procedural characteristics create programs composed of a series of statements
that tell the computer how to perform the process for specific task.
Procedural languages are well suited for programs that follow a step by step algorithm.
Programs created with procedural languages have a starting point and an ending point.
Declarative
A declarative language lets a programmer write a program by specifying a set of statement and
rules that define the conditions for resolving a problem.
Declarative languages are useful for programs that manipulate ideas and concepts, rather than
numbers.
A program created with a declarative language describes what the problem is.
Scripting Languages
A scripting language defines a task in the form of a script. Scripts require a host application to
run and cannot be run as a standalone application.
For example, you use HTML tags to specify a scrip for how to display a Web page. This script is
interpreted by a Web browser. The Web brewer is the host application without it, the HRML
script cannot run.
Low Level
A low level language requires a programmer to write instructions for the lowest level of
computer system that is, for specific hardware elements such as the processor, and RAM
locations.
High Level
A high level language allows a programmer to use instructions that are more like human
language.
For example, BASIC language is a high level language.
Compiled
A compiler translates a program written in a high level language into low level instruction
before the program is executed.
When you use a compiled language, you must compile your program to produce executable
program code.
Interpreted
An interpreted language uses an interpreter instead of a compiler to create code that the computer
can execute.
Object - Oriented
Object oriented languages are based on an approach to programming that uses objects.
(2) Program Development Life Cycle
A computer program is a set of detailed, step by step instructions that tell a computer how to
solve a problem or carry out a task.
Programmers do not sit down and start writing code right away when trying to make a computer
program. Instead, they follow an organized plan or methodology that breaks the process into a
series of tasks.
This organized plan or methodology is what termed program development life cycle.
The program development life cycle involves the following basic steps:
Problem Definition/Problem statement
Problem Analysis
Algorithm design and representation
Actual coding
Testing and debugging
Complete documentation and operator procedures ready for implementation.
In order to understand the basic steps in the program developmental life cycle, let us define a
single problem that we will solve step by step as we discuss the problem solving
methodologies.
Problem Definition
Problems that you might try to solve using a computer often begin as questions. So a
programmer is usually given a task in the form of a problem.
Before a program can be designed to solve a particular problem, the problem must be well and
clearly defined first in terms of its input and output requirements.
Computer programming requires us to define the problem first, before we even try to create a
solution.
Problem Analysis
This step involves breaking up the problem into smaller and simpler sub problems.
Example Problem:
Determine the number of times a name occurs in a list.
An algorithm is a clear and unambiguous specification of the steps needed to solve a problem.
The pseudocode, which is cross between human language and programming language
Now for our example problem, how do we express our solution as an algorithm?
Actual Coding
After constructing the algorithm, it is now possible to create the source code.
Using the algorithm as basis, the source code can now be written using the chosen programming
language.
Coding is the process of using a computer language to express an algorithm.
As you are coding a program, you must test each section of your code to make sure it works
correctly. This process is referred to as debugging because the process gets the bugs out so
they dont cause errors when you use the program.
Program Documentation
As you are coding, you should also write documentation as a permanent record that explains how
your program works.
Program documentation explains how a program work and how to use it.
Every programming language consist some basic elements of features which are required to
make a program.
The elements required to construct a QBASIC program consists of a set of characters, keywords,
constants, variables, operators and expressions.
Data Types
Every variable used in the program has a data type. The table below shows the different types of
variables available in QBASIC:
When you ran a QBASIC program, the statements of the program are stored in main memory.
The data for the program can also be stored in main memory.
The data for the program also can be stored in main memory.
A variable in QBasic is a small amount of computer memory that has been given a name.
A variable is like a small box that holds a value. The value in the variable can change (that is why it is
called a variable)
A constant in QBASIC is a variable whose value does not change during the execution of a program.
The assignment statement allows the programmer to enter data or information into the computer
be the execution (RUN) of the program.
Example: LET AGE % = 30 or AGE % = 30
Operators and precedence
Operators are symbols that indicate the type of operation QBASIC has to perform on the data or
on the values of variables.
Arithmetic operators have each been given a priority. When there is a choice, do the highest
priority operation first.
In programming, output means data that the program sends outside itself to some device. For us,
output mostly will go to the computer monitor.
QBASIC uses the INPUT statement to input data from the keyboard into the program.
The INPUT statement is used to get data from the keyboard. It will:
Print a question mark ? to the screen.
Wait until the user has typed in a value
Get the value when the user hits the enter
Put the value in the variable.
In QBASIC, the PRINT statement is use to output data from the program to the screen.
Built in functions
A function in QBASIC is a readymade program or user made (small) program which helps to
perform a specific task.
A built in function is ready made programs that accept data and return a value. These
functions are written by the developer of QBASIC at the time of development of QBASIC.
Without the control statements, the flow of execution program statement is sequential, ie from
one statement to the next.
The if else statement is used to express conditional expressions. If the given condition is true
then it will execute the statements; otherwise it will execute the optional statements.
The Select Case statement is a special multi way decision maker that tests whether an expression
matches one of the numbers of constant values, and executes accordingly.
Looping Constructs
Looping Statements involves:
For Loop
While Loop
Do Loop
Go to Loop (breaking statement)
The For Loop is the most commonly used statement in QBASIC. This loop consists of three
expressions. The first expression is used to initialize the index value, the second to check
whether or not the loop is to be continued again and the third to change the index value for
further iteration.
The While Loop is used when we are not certain that the loop will be executed. The execution
loops only when the initial condition is true.
The Do Loop, is used when we want to execute first before checking the condition.
The Go to statement is used to alter the program execution sequence by transferring control to
some other part of the program.
Single dimensional arrays
A list of quantities can be given one variable name using only one subscript and such a variable
is called a single subscripted variable.
For example, a set of five numbers say (19, 17, 11, 3, -5) can be represented in an array as x (5).
Where x is an array name and 5 is subscript of index.
Nested Loops
An algorithm is an abstract idea, but it can be written down and it can be implemented.
The algorithm is written down, or expressed, as instructions in solving a problem.
An important characteristic of a correctly formulated algorithm is that by carefully following the
steps, you are guaranteed to accomplish the task for which the algorithm was designed.
An algorithm for a computer program is typically first written in a format that is not specific to a
particular computer or programming language.
The algorithm is translated into instructions written in a computer programming language so the
algorithm can be implemented by a computer.
Structured English is a subset of the English language with a limited selection of sentence
structures that reflect processing activities.
Psendocode is a notational system for algorithms that has been described as a mixture of
English and your favorite programming language.
Flow Chart is a graphical representation of the way a computer should progress from one
instruction to the next when it performs a task.
Object definition
Another way to express an algorithm is to define the objects that the computer must
manipulate, and then specify the method for manipulating each object.
Sequences
A sequence of instructions that are executed in the precise order they are written in:
o Statement block 1
o Statement block 2
o Statement block 3
Conditionals
Select between alternate courses of action depending upon the evaluation of a condition.
Loops
Loop through a set of statements as long as a condition is true.
(4) Flow Chart
A flow chart is a graphical representation of the way a computer should progress from
one instruction to the next when it performs a task.
Start or end
Input or output
Decision
Calculation
Connector
Flow line
Machine Language / Code: A low level language written in binary code that the computer can
execute directly.
Boolean Expression:
Class: In object oriented programming, a group with specific characteristics, to which an object
belongs.
Comment:
Compiler: Software that translates the program written in a high level language into
Event driven language: A computer language that helps programmers create programs that
continually check for, and respond to, program events.
Syntax: Specifications for the sequence and punctuation of command words, parameters and
switches.
Syntax error: An error that results when an instruction does not follow the syntax rules, or
grammar, of the programming language.
Run time error: An error that occurs when a computer program is run.
OOP: Object oriented languages, Programming languages that focus on the manipulation of
objects rather than on the generation of procedure based code.
Objectives Cont.
8. Explain the term HTML
9. State the basic structure for HTML tags
10. Explain and use basic HTML tags
11. Explain some best practices in website development.
12. Create, format and insert text into tables using HTML
13. Create an ordered an unordered list
14. Insert images and hyperlinks
The Web provides opportunities for publishing tasks ranging from a single page to an
entire Web site.
A single Web page is simple to create and can publish useful information such as your
resume or a publicity flyer for your school.
Another use for a single Web page is to provide a list of links to sites information on a
particular topic.
A Web site includes a series of Web pages and has its own domain name.
Business and organizations of all sizes create Web sites to provide information to
customers and to sell products.
These instructions, called HTML tags, are inserted into the text of the document.
Writing HTML document entails using tag correctly to create your vision.
The head of the document specifies a little that appears on the title bar of the Web
browser when the Web page is displayed.
The body of the document contains informational text, graphics, and links.
Every HTML document should begin with the tag < HTML> and end with the tag < /
HTML>.
The traditional way to create an HTML document is with a basic text editor such as the
Noted pad program included with Microsoft Windows.
Simply type the HTML tags and the text for your Web page, then save the file with an
HTM extension or HTML extension.
These special instructions tell a web browser how to display the text, graphics and
background of a Web page.
Each tag appears as letters / words / short codes between angle brackets, < >.
Some HTML tags work in pairs. They are called Paired / Container Tags.
Some HTML tags do not have a corresponding end tag. They are called Singular /
Empty Tags. For example, you only need a single < BR > tag to create a line
break.
The following are set of HTML tags that you can use to create HTML documents
for Web pages.
o < BR >
Insert a line break. Can be used to control line spacing and break in lines.
o < UL > < /UL> , < OL > < / OL>
Indicates an unordered list (list items are preceded by bullets) or an
ordered list (list items are preceded by numbers or letter).
o < L1>
Indicates a list item. Precedes all items in unordered or ordered lists.
o <B></B>
Indicate that the enclosed text should appear bold face.
o <1></1>
Indicate that the enclosed text should appear italic.
o < HR >
Insert a horizontal rule.
Basic design rules for the text, backgrounds, and graphics on your Web pages includes:
Text:
o For readability, use black type for large sections of text.
o Maintain narrow line widths. Text that stretches across the entire width of the screen is
more difficult to read than text in columns.
o Make sure you proofread your document for spelling errors.
Background:
o White or a very pace color makes a good background.
o Avoid gray and dont let your background color or graphic make it difficult to read the
text.
Graphics:
o Try not to use graphics files that exceed 30 KB because larger files take too long to
transfer, load, and appear on a Web page.
o Use graphics with gif, not bmp extensions.
o To include a large graphic, present it as a small thumbnail with a link to the larger
version of the graphic.
Creating Tables Using HTML
A table is a two dimensional matrix with rows and columns.
o Tables are made up of many parts, all inside one another.
o < tr > starts a new Table Row. Rows are ended with a closing < / tr >
o < td > means Table Data, but we will always call them table cells.
The formatting is done by the use of table attributes. The table attributes are:
o Align
Just like most elements, whole tables, rows or cells can be aligned to center, left or right.
o Width
Is used to specify how wide the table is, either in pixels or in a percentage of the screen
width. For example, you could specify width = 400 or width = 80%. Try to keep the
widths under 750 pixels at most, so that it fits into the width of most peoples monitors.
o Cell padding
Is the space around anything in the td. i.e. the space around the text in each cell.
o Height
< table height = 300 >
o Cell padding
< table cell padding = 3 >
o Border
< table border = 3 >
The following HTML codes are used for the text formatting:
Heading
< h1 > Heading < / h1 >
< h2 > Heading < / h2 >
< h3 > Heading < / h3 >
< h4 > Heading < / h4 >
< h5 > Heading < / h5 >
< h6 > Heading < / h6 >
Colour
< font color = FFOOOO >
Alignment
< P align = center > Aligning text to the center < / p >
< font size = 3 > This line is shown in the normal font < / font > < br / >
< font size = +3 > Up 3 to change the font size to 6. < / font > < / 6r >
< font size = 3 face = sans serif > changing the font face < / font > < / br >
HTML Supports:
o Ordered list
o Unordered list
Unordered list
o Displays bulleted list of items
o Unordered list denoted by the tags < uL > < / uL >
o Each list item is marked with < li > item.
o Bullet type must be specified with type attribute
type = disc / circle / square
Ordered Lists:
Uses numbers, alphabets or roman numerals to list items
Ordered List is denoted by the tags < ol > - < / ol >
Each list item is marked with < li > item
Number type must be specified with type attribute
type = i / A / a / I
To alter the numbering sequence use start attribute
Start = 3 / d / ii / c
Format
< a href = url > Link text to display < / a >
Image As A Hyperlink
Format
< a href = page url >
< img src = image url >
</a>
Example
< a href = home htm >
< img border = 0 , src = logo. gif
width = 65 height = 38 >
</a>
Image to be inserted should be in the same folder together with the other files associated with the
website.
BASIC is a high level, procedural language. Most versions of BASIC are interpreted
languages, although some versions provide compiling capabilities.
Features of QBASIC
Some features of QBASIC are listed below:
o QBASIC does not use technical terminology (word) to write statements.
o QBASIC automatically checks syntax.
o QBASIC capitalizes the reserved words.
o QBASIC keeps the same variable name used in a program to identical form.
o QBASIC allows you to break lengthy programs into modules.
o QBASIC interprets a statement of a program at a time to CPU.
Immediate Window
This is the lower window which is titled as immediate and is the window where you test
commands, expressions, etc. As soon as you press Enter Key, it displays the output on the
screen. F6 function key is used to switch between Program window and Immediate Window.
Status Bar
The Status bar shows short cut keys and the location of the curser on the screen.
Running A Program
To see the output of the program, after entering a set of instructions in the program window, you
must run the program. To run (execute) a program,
Press (1) Shift + F5 key or
(2) Alt, R , S
Saving A Program
You need to save a program for the future use. To save a program, follow these steps:
1. Press ALT + F key
2. Highlight Save As Option
3. Press Enter key. It displays Save Dialog Box
4. Enter Filename in the File name text box
5. Press Enter key
NOTE: (1) File name should not be more than eight characters.
(2) QBASIC automatically adds an extension as BAS for the program file.
Exiting QBASIC
Programming in QBASIC
Every programming language consists of some basic elements which are required to
make a program.
Character Set
A set of characters that are allowed to be used in QBASIC is known as the QBASIC character
set. The QBASIC character set consists of alphabets (both small and capital), numbers (0 to 9)
and special characters.
Keywords
Keywords are formed by using character of QBASIC character set. Keywords are statements,
commands, functions (built in functions) and names of operators. The keywords are also called
Reserved Words.
CLS, REM, INPUT, LET, PRINT, FOR, DO, SELECT, MID$, ASDC, SQR, LEN, LEFT $,
TIME$ and INT.
Constants
Constants are the data or the values in a program that cannot be changed during the
program execution.
Numeric Constant refers to a number. A number with or without decimal point is a numeric
constant.
Variable
A variable is a place in the computer memory which has a name and stores data temporarily.
Operators
Operators are symbols that indicate the type of operation QBASIC has to perform on data
or on the values of variables.
They are:
o Arithmetic Operators
o Relational Operators
o Logical Operators
o String Operators
Expressions
An expression is the combination of operations, constants and variables that is evaluated to get a
result.
Example size = 10
Make decisions
Example: If the pizza is square, calculate square Inches by multiplying the size * size
Example; Repeat the price calculations for as many pizzas as the user wants
Practical
4. Write a program to print maximum value and minimum number. Number should be
inputted through the keyboard.
Solution
CLS
DIM x (10)
INPUT any value ; x (i)
NEXT i
max = x (1)
min = x (1)
FOR i = 1 TO 10
IF max < x (i) THEN max = X (i)
IF min > x (i) THEN min = X (i)
NEXT i
PRINT the maximum value; max
PRINT the minimum value, min
END