COURSE TITLE

WEB TECHNOLOGIES

COURSE CODE

SIT 208

PORTFOLIO

FACULTY

Dr. Achenke Peter

NAMES:

CHITCHOUA HAPPY CHRISTELLE DURIANE

MATRICULE:

19SI-004482

SCHOOL

INFORMATION TECHNOLOGY

DEPARTEMENT

SOFTWARE ENGINEERING

SOPHOMORE (Level 2)

Date: 10/06/2021

1
TABLE OF CONTENT

ABSTRACT.......................................................................................................................... 2

INTRODUCTION .................................................................................................................. 4

HTML………………………………………………………………………………………..4

HTTP Request: GET vs. POST ……………………………………………………………4

CSS......................................................................................................................................... 5

JAVASCRIPT………………………………………………………………………………..6

MYSQL………………………………………………………………………………………8

BOOTSTRAP.......................................................................................................................9

JQUERY............................................................................................................................... 9

JQUERY HIDE ( ) AND SHOW ( ) .................................................................................. 9

Bibliography ......................................................................................................................... 10

2
 ABSTRACT

The purpose of this work is to evaluate how I am following and understanding the course as
the semester goes on. What I studied and learnt related to the course is listed below. This
document presents how I better understand the course and how I implement when coding.
The document also contains some of the programs that I’ve coded using the different web
technologies learnt and the output I was able to obtain. It is to make my brain use the concept
of creating a web sites and CRUD applications by myself and understanding how to use the
different web technologies efficiently to solve a problem or bring up a change in the society.

3
 INTRODUTION

Web Technologies are means by computers to communicate with each other using markup
languages and multimedia packages. It gives us a way to interact with hosted information. In
other words web technologies are tools used to design and host webpages on the internet.
During this course, we studied HTML, JavaScript, CSS, PHP, and MySQL which helped us
to create a dynamic interactive websites with various web pages. Also, we were able to
create a database in the Xampp server and create an interactive CRUD application with
embedded PHP codes which we used to connect to the websites. The database could directly
connect to the web forms and some actions could be taken. Apart from these there are other
interesting web technologies which can be used in such projects. Some include; Bootstrap,
JQuery, Laravel, WordPress.

HTML
HTML is the standard markup language done on a text editor for documents designed to be
displayed on the web browser which can be assigned by technologies such as CSS and
scripting languages such as JavaScript. There are basic syntax an HTML file must have. I
have learn to create boxes, forms, tables, and display content using div and span tag.

HTTP Request: GET vs. POST

Two commonly used methods for a request-response between a client and server are: GET
and POST.

 GET - Requests data from a specified resource

 POST - Submits data to be processed to a specified resource

GET is basically used for just getting (retrieving) some data from the server. Note: The GET
method may return cached data.

POST can also be used to get some data from the server. However, the POST method
NEVER caches data, and is often used to send data along with the request.

CSS
Cascading Style Sheet is mainly used for describing the presentation or styling of a document
written in html. I have learnt that there are three types of styling which are internal, external
and inline styling. Internal and inline styling are done inside the html document while

4
external styling is done in an external file. CSS keeps track of the beauty of your webpage
either color, position of block etc…

Figure 1
Here is an inline CSS

Figure 2 Here is an external CSS.

NB: To connect the external CSS to your html document, you need to include the CSS file
name using the link html tag.

Figure 3
Which will be included in href = ‘filename.css’’

Figure 4 Here is internal styling.

I have also learnt that to style a particular areas you use selectors and there are different type
of selectors in CSS. But basically to select a class or an ID we use (. and #) respectively.

5
Classes, IDs, divs, Span are basic HTML syntax used to differentiate particular blog from the
others.
JavaScript
It is a text-based programming language used both on client and server sites that gives
webpages interactive elements that engage a user. Some JS code snippet of what I did are
seen below

Figure 5 Here is a code that permits the user to enter his name then later on receive a
popup welcome alert

Under Database design I have learned how to manually design a database by identifying the
information needed that is entities, attributes and relations. Then draw an ER diagram to
diagrammatically present my database and later on do a relational schema which easily
permits me to implement my database using a software. It can also be done on software like
EdrawMax.

I’ve designed an ER-diagram diagram using EdrawMax as shown below

6
MYSQL
It is an open-source relational database management system. Here, I have learnt how to create
a database, create a table, input data or information in a table and how to do queries to either
retrieve, modify, insert or delete data from a database by downloading.

Figure 6 this is a database of a hospital management I created

PHP
It is a general-purpose scripting language especially suited to web development. It is used to
manage dynamic content, databases and session tracking. It is considered a backend scripting
language.

I’ve learnt how to insert, modify and delete data from a database I created using PHP codes.

7
Figure 7
PHP and JS are loosely-typed meaning it does not require a variable to be defined. All
variables in PHP begin with $.

In addition, I’ve learnt that

 CSS, html and JS are client-side languages meaning it is displayed on the client (end
user device) which includes what the user can see such as text, images etc.… While
PHP is a server-side language which refers to operations that are performed by the
server.
 Html and CSS are scripting languages while JavaScript and PHP are loosely-typed
programming languages.

BOOTSTRAP
Bootstrap is a potent front-end framework used to create modern websites and web apps. It's
open-source and free to use, yet features numerous HTML and CSS templates for user
interface elements such as buttons and forms. Bootstrap also supports JavaScript extensions. I
decided to focus on the latest version of Bootstrap which is Bootstrap 4 because it is the
newest version of Bootstrap; with new components, faster stylesheet and more
responsiveness.

Here is a dropdown menu I created with bootstrap

8
Figure 6

JQUERY
JQuery is a fast, small, and feature-rich JavaScript library. It makes things like HTML
document traversal and manipulation, event handling, animation, and Ajax much simpler
with an easy-to-use API that works across a multitude of browsers. With a combination of
versatility and extensibility, jQuery has changed the way that millions of people write
JavaScript.

JQUERY HIDE ( ) AND SHOW ( )

With jQuery, you can hide and show HTML elements with the hide () and show () methods

9
 Bibliography

Jquery hide_show. (n.d.). Retrieved from w3schools:

https://www.w3schools.com/jquery/jquery_hide_show.asp
W3schools. (n.d.). Bootstrap 4 Navigation Bar. Retrieved from W3schools:
https://www.w3schools.com/bootstrap4/bootstrap_form.asp

10