title PAGE

UNIVERSITY OF BENIN
DEPARTMENT OF COMPUTER SCIENCE

INDUSTRIAL TRAINING REPORT

UNIVERSITY OF BENIN INDUSTRIAL TRAINING SCHEME

(UBITS)

BY
OKON FREANMI
PSC1603911

AUGUST, 2021.
 UNIVERSITY OF BENIN
DEPARTMENT OF COMPUTER SCIENCE

INTERNSHIP REPORT
STUDENT INDUSTRIAL WORK EXPERIENCE SCHEME
(SIWES)

SUPERVISED BY:
SAMUEL ADEBISI (MR)
AT

AUGUST, 2021.
 DECLARATION

I, Okon Feranmi EmemObong, hereby declare that the presented report of

internship is uniquely prepared by me after the completion of six months

internship at Uleval Technology on this day 13th August, 2021.

I also confirm that, the report is only prepared for my academic

requirement not for any other purpose. It might not be used with the interest of

opposite party of the corporation

___________________________

OKON FERANMI EMEMOBONG DATE

PSC1603911
 CERTIFICATION

This to certify that the bearer OKON FERANMI EMEMOBONG with

matriculation number PSC1603911 of the Department of Computer Science,
Faculty of Physical Sciences of University of Benin, Uniben, Edo state carried out
his student Industrial work experience scheme (SIWES) at Uleval Technology 6,
SojI Adepegba street Ikeja, P.M.B. 1003, Benin City, Edo State, Nigeria.

OKON FERANMI EMEMOBONG DATE

PSC1603911

(STUDENT)

Mr. Samuel Adebisi DATE

(INDUSTRIAL BASED SUPERVISOR)

 ACKNOWLEDGEMENTS

First and foremost, I want to thank the Almighty God who gave me an
Internship with a great company and saw me throughout the Internship. I want to
appreciate the Front end developer at Uleval technology for their mentorship and
support given to me throughout the period of my stay. I want to say a big thank
you to Mr Stanley, Mr Adebisi, this report wouldn’t have been completed if it not
for their timely advice. I also want to appreciate my colleagues at Uleval.
 ABSTRACT

This report summarizes my six months internship experience at Uleval Technology

Uleval as a trainee Computer science under the Front-end-developer Department

of the company.

The report starts out with a look at the company Uleval, its history, organization
structure, policies and products and services.

Chapter three then goes on to give a detailed account of the tasks I actually
carried out as an intern; tasks which include declarative languages like HTML,CSS
to build web apps and learning about adding interaction to a website by learning
JavaScript. Also learnt how to create a Database for my web app and to connect
the database to a server-side-language like using PHP. It also gives a detailed
account of the steps and workflows involved in carrying out this tasks along with
descriptive diagrams where necessary.

Chapter four and five analyses the experience gained as an intern into: knowledge
gained, Soft skills and communication skills to reflect on professional identity and
practice in work places, as well as the nature and quality of job or service. It also
discusses the various problems encountered by me in carrying out various tasks
and the solutions that were proffered.

Chapter six concludes the repot by discussing my findings and giving

recommendations.
Table of Contents
title PAGE...............................................................................................................................................1
DECLARATION..........................................................................................................................................3
CERTIFICATION........................................................................................................................................4
ACKNOWLEDGEMENTS............................................................................................................................5
ABSTRACT................................................................................................................................................6
LIST OF FIGURES.................................................................................................................................9
CHAPTER ONE............................................................................................................................................10
1.0 INTRODUCTION.........................................................................................................................10
1.1 PURPOSE OF THIS REPORT..............................................................................................................11
1.2 HISTORY OF SIWES....................................................................................................................11
1.3 AIMS AND OBJECTIVES OF SIWES.............................................................................................11
1.4 BODIES INVOLVED IN THE MANAGEMENT OF SIWES...............................................................12
1.5 BENEFITS OF SIWES:..................................................................................................................13
1.6 LIMITATIONS OF SIWES:............................................................................................................14
CHPATER TWO..........................................................................................................................................15
2.0 COMPANY PROFILE...................................................................................................................15
2.1 MISSION & VISION STATEMENT...............................................................................................15
2.2 CORE VALUES:...........................................................................................................................16
2.3 COMPANY ORGANOGRAM.......................................................................................................17
CHAPTER THREE........................................................................................................................................18
3.0 WEB DEVELOPMENT..............................................................................................................18
3.0.0 WHAT IS WEB DEVELOPMENT?.........................................................................................19
3.0.1 DOMAIN NAME SYSTEM...................................................................................................20
3.0.2 DIFFERENT TYPES OF DOMAIN NAME..............................................................................22
3.0.3 WEB HOSTING...................................................................................................................23
3.0.4 FRONT-END DEVELOPMENT (WEB DESIGN).....................................................................25
3.0.5 BACKEND DEVELOPMENT................................................................................................28
3.0.6 PHP........................................................................................................................................30
3.1 WORDPRESS.............................................................................................................................31
CHAPTER FOUR.........................................................................................................................................33
4.0 NO CODE APPS.............................................................................................................................33
4.0.1 TYPES OF NO CODE APPS......................................................................................................34
 4.0.2 BUBBLE.io..............................................................................................................................34
4.1 VISUAL PROGRAMMING (SCRATCH)............................................................................................36
CHAPTER FIVE...........................................................................................................................................39
5.0 The Ray Online Project..................................................................................................................39
5.1 Bubble Projects.............................................................................................................................41
5.1.0 Personal Shopper..................................................................................................................41
5.1.1 Tinder Clone..........................................................................................................................42
5.2.1 Todo Application...................................................................................................................43
5.3 WordPress Project.........................................................................................................................45
CHAPTER SIX.............................................................................................................................................46
6.0 CONCLUSION...................................................................................................................................46
6.1 RECOMMENDATIONS.....................................................................................................................46
REFERENCE................................................................................................................................................47
 LIST OF FIGURES

Figure 1 Company Organogram.................................................................................................................18

Figure 2 Dns server....................................................................................................................................21
Figure 3 pic of a developer working..........................................................................................................26
Figure 4 PIC of xampp server.....................................................................................................................32
Figure 5 Pic of a xampp server...................................................................................................................32
Figure 6 Bubble interface..........................................................................................................................36
Figure 7......................................................................................................................................................38
Figure 8......................................................................................................................................................38
Figure 9 Scratch interface..........................................................................................................................38
Figure 10....................................................................................................................................................39
Figure 11 Rayoo oline project....................................................................................................................39
Figure 12....................................................................................................................................................40
Figure 13 Visual studio code......................................................................................................................40
Figure 14Rayoo online project...................................................................................................................41
Figure 15....................................................................................................................................................42
Figure 16 Bubble interface........................................................................................................................42
Figure 17....................................................................................................................................................43
Figure 18....................................................................................................................................................45
 CHAPTER ONE

1.0 INTRODUCTION

The Students Industrial Work Experience Scheme (SIWES) is a skills training

program designed to expose and prepare students of universities and other
tertiary institutions for the Industrial Work situation they are likely to meet after
graduation.  It is also a planned and structured program based on stated and
specific career objectives which are geared towards developing the occupational
competencies of participants.  Consequently, the SIWES program is a compulsory
graduation requirement for all Nigerian university students offering certain
courses.

The students are normally attached to a recognized industrial or company for a

period of three months during their long holiday between 200 level and 300 level,
prior to this period, the SIWES officer in the SIWES offices of the university would
have liaised with the various industries and companies and the ITF office. The
Students Industrial Work Experience Scheme (SIWES), is the accepted training
program, which is part of the approved Minimum Academic Standard in the
various degree program for all Nigerian Universities.  The scheme is aimed at
bridging the existing gap between theory and practice of Sciences, Agriculture,
Medical Sciences (including Nursing), Engineering and Technology, Management,
and Information and Communication Technology and other professional
educational program in the Nigerian tertiary institutions. 

1.1 PURPOSE OF THIS REPORT

This report serves as a summary of the activities and experiences gained during
the period of the IT (Industrial Training) program.

This report is also written in fulfilment of the SIWES program.

1.2 HISTORY OF SIWES

Student Industrial Working Experience Scheme (SIWES) was established by ITF in

1973 to solve the problem of lack of adequate practical skills preparatory for
employment in industries by Nigerian graduates of tertiary institutions. The
Scheme exposes students to industry based skills necessary for a smooth
transition from the classroom to the world of work. It affords students of tertiary
institutions the opportunity of being familiarized and exposed to the needed
experience in handling machinery and equipment which are usually not available
in the educational institutions. Participation in SIWES has become a necessary
pre-condition for the award of Diploma and Degree certificates in specific
disciplines in most institutions of higher learning in the country, in accordance
with the education policy of government.

1.3 AIMS AND OBJECTIVES OF SIWES

The objective of SIWES among others include to:

 Provide an avenue for students in institutions of higher learning to acquire

industrial skills and experience in their approved course of study;
  Prepare students for the industrial work s situation which they are likely to
meet after graduation.
 Expose students to work methods and techniques in handling equipment
and machinery in their institutions.
 Provide students with an opportunity to apply their knowledge in real work
situation thereby bridging the gap between theory and practices.
 Enlist and strengthen employers’ involvement in the entire education
process and prepare students for employment in industry and commerce
(Information and Guideline for SIWES 2002).

1.4 BODIES INVOLVED IN THE MANAGEMENT OF SIWES

Operators of SIWES are:

ITF - Industrial Training Fund

NUC – National Universities Commission

NCCE – National Council for College of Education

NBTE – National Board for Technical Education

Funding is made by the Federal Government of Nigeria.

Beneficiaries are the Undergraduate students of Agriculture, Engineering,

Technology, Environmental, Science, Education, Medical Science and Pure and
Applied Sciences.

Duration for the SIWES is One year for Polytechnics, Six month for Colleges of
Education, and Six months for the Universities.
1.5 BENEFITS OF SIWES:
Experts identified industrial experience as necessity for proper job preparation.
This is because productivity is enhanced by experience graduate or new entrance
into the world of work really needs and early exposure to the value and skills of
the industry. Therefore, without appropriate skills and experiences young
graduates are not properly trained on work, norms and role behavior among
others, these components will ensure success at the job place.

Today Information and Communication Technology (ICT) is changing the way

many jobs are performed, thus altering the knowledge and skills required of
workers. Consequently, a new level of competency is required of our students.
This cannot be sufficiently met by training facilities in our education institutions
hence, which calls for the need for collaborative effort between institutions and
industrial sector.

The Major Benefit for students who participate in his Industrial training is the
Skills they acquire. These skills remains part and parcel of these students that
they can’t be taken away from them. This is because the knowledge and skills
acquired through training are internalized and become relevant when required to
perform jobs or functions. This program provides students with enabling
environment where students can develop and enhance personal attributes such
as critical thinking, creativity, initiative, resourcefulness, leadership, time
management, presentation skills and interpersonal skills, amongst others.
1.6 LIMITATIONS OF SIWES:
As with every man desired scheme which is bound to have imperfections, so is
SIWES, though the scheme has been of more success than a failure since its
inception, a few problems ensure that the SIWES scheme is denied the ability to
reach its full potential. These few limitations are:

 Inadequate funding and poor management by the government and top

management respectively.
 Inefficient staff to ensure that each student is visited and supervised in
his/her place of IT.
 CHPATER TWO

BRIEF HISTORY OF THE ESTABLISHMENT

2.0 COMPANY PROFILE

ULEVAL TECHNOLOGY is a full spectrum ICT Solution Company incorporated
under the laws of the Federal Republic of Nigeria. It was incorporated in the year
2016. It has further met all other criteria by other enabling laws guiding the
regulation and setting up of such company. This company is committed to
providing cost effective Information Technology and communication Solutions to
both individuals and corporate organizations.

Uleval Technology offers specialized support services in the following areas.

 Business & Brand Consulting

 Market Research & Analysis
 Software Product Development
 Platform Review & Product Sales
 Digital Marketing & SEO Optimization
 IT Infrastructure
 Training, Mentoring & Tutoring
 On demand Technology & Cloud Computing

2.1 MISSION & VISION STATEMENT

We aim to provide the best possible reliable solution for both individuals &
businesses to improve IT efficiency & business profitability.
To lead in Quality & value with strategic impact in daily activities

To provide Technological oriented solution for maximum efficiency & profitability

To be the premier specialist business application consulting firm delivering world

class services and values in Nigeria and beyond. Advanced computer operations

2.2 CORE VALUES:

QUALITY: Uleval Technology always adheres to principles of best practice and

service excellence. In so doing, they have built a name for themselves that has
undoubtedly become a by-word for quality.

INTEGRITY: Uleval Technology remains true to its founding values of honesty and
integrity. High official standards and professional culture characterize all their
activities and their clients have come to expect nothing less.

FLEXIBILITY: We build solutions to client requirement specifications. We also have

a proven ability to quickly react and adjust to changes that may arise during a
project, thus minimizing any adverse impact.

SPEED: Availing of better techniques and advanced technology we consistently

keep improving the productivity of our software engineers with a view to
improving time to market and lowering the costs of delivery

REASONABLE COST: Due to lower operating costs and the availability of highly
qualified individuals with a proven ability in Information Technology, Nigeria has
emerged as a global leader in the areas of research and technology. This has
resulted in a price to productivity ratio that allows you a very good return on
investment.
2.3 COMPANY ORGANOGRAM

The organizational structure of Uleval Technology is described by the organogram

below:

DIRECTOR

PERSONNEL
MANAGER

HEAD OF CREATIVE
HEAD OF HUMAN
DEPARTMENT
DEVELOPMENT RESOURCE
DEPARTMENT MANAGER

FRONT END DEVELOPERS Graphics Designers ACCOUNTANT

RECEPTIONIST
STAFF
Social Media
Marketer
BACK END
sManagers
DEVELOPERS
 Figure 1 Company Organogram

CHAPTER THREE
INDUSTRIAL EXPERIENCE

My industrial experience at Uleval technology was focused mainly on web

development, I carried out projects on the Front-end and Back-end of web
development. I also engaged in other activities such as WordPress development,
UI/UX design, use of No code Applications and Visual Programming. Their major
stack for web development consisted of HTML, CSS (bootstrap), JavaScript (Vue.js)
and PHP. As you continue to read you would get a brief understanding of web
development

3.0 WEB DEVELOPMENT

3.0.0 WHAT IS WEB DEVELOPMENT?

Web development is the work involved in developing a Web site for
the Internet (World Wide Web) or an intranet (a private network). Web
development can range from developing a simple single static page of plain
text to complex web applications, electronic businesses, and social network
services. A more comprehensive list of tasks to which Web development
commonly refers, may include Web engineering, Web design, Web content
development, client liaison, client-side/server-side scripting, Web
server and network security configuration, and e-commerce development. There
are many areas in web developments but it is mostly divided into two main
categories. Firstly, the Front-End which has to do which has to do with the part
the user can see it focuses on client-side, this is the part of web development
which users interact with. People who create the Front-end aspect of a website
only are called Front-End Developers or Web designers. The main stack of a front
end developer comprises of HTML CSS and JAVASCRIPT. The second category is
the Back-End. This part focuses heavily on the server side and functionality of the
website, users don’t get to see this side of the website. People who create the
Back-end are called Back-end developers or web developers. The main stack of a
Back-end developer comprises of sever side programming language like PHP,
Node.js, Python (Django) and lots more. A personnel who handles both the Front-
end and Back-end is called a Full stack Developer, a full stack developer has to
know all the languages both server side and front end scripts.

Web developers make use of code editors such as Visual Studio Code to write
down their programs and the run it on a web browser using a local server (mostly
for testing). When a web developer is done with a site he/she would have to
purchase a domain name and hosting plan where he uploads the website’s
documentation to. Once the website is uploaded to a hosting platform the user
can type in the domain name (URL) on any web browser and access the website.

3.0.1 DOMAIN NAME SYSTEM

Domain name is the address of your website that people type in the browser URL
bar to visit your website. In simple terms, if your website was a house, then your
domain name will be its address.

A more detailed explanation:

The Internet is a giant network of computers connected to each other through a
global network of cables. Each computer on this network can communicate with
other computers.
To identify them, each computer is assigned an IP address. It is a series of
numbers that identify a particular computer on the internet. A typical IP address
looks like this: 66.249.66.1.
Now an IP address like this is quite difficult to remember. Imagine if you had to
use such numbers to visit your favorite websites. Domain names were invented to
solve this problem.
Now if you want to visit a website, then you don’t need to enter a long string of
numbers. Instead, you can visit it by typing an easy to remember domain name in
your browser’s address bar. For example, theking.com.
Figure 2 Dns server

When you enter a domain name in your web browser, it first sends a request to a
global network of servers that form the Domain Name System (DNS).
These servers then look up for the name servers associated with the domain and
forward the request to those name servers. For example, if your website is hosted
on Blue host, then its name server information will be like this:
ns1.bluehost.com
ns2.bluehost.com
These name servers are computers managed by your hosting company. Your
hosting company will forward your request to the computer where your website
is stored. This computer is called a web server. It has special software installed
(Apache, Nginx are two popular web server software). The web server now
fetches the web page and pieces of information associated with it. Finally, it then
sends this data back to the browser.

3.0.2 DIFFERENT TYPES OF DOMAIN NAME

Domain names are available in many different extensions. The most popular one
is .com. There are many other options like .org, .net, .TV, .info, .io, and more.
However we always recommend using .com domain extension.
Let’s take a more detailed look at different types of domain names available.
Top Level Domain – TLD
Top level domain or TLD are generic domain extensions that are listed at the
highest level in the domain name system.
There are hundreds of TLDs, but the most popular ones are .com, .org, and .net.
Other TLDs are lesser known and we don’t recommend using them. For
example, .biz, .club, .info, .agency, and many more.
Country Code Top Level Domain – ccTLD
Country code top-level domain or ccTLD are country specific domain names which
end with country code extension like .uk for the United Kingdom, .de for
Germany, .in for India.
They are used by websites that want to target audiences in a specific country.
Sponsored Top Level Domain – sT LD
Sponsored top-level domain or sTLD is a category of TLDs that has a sponsor
representing a specific community served by the domain extension.
For example, .edu for education-related organizations, .gov for the United States
government, .mil for the United States military, and more.
3.0.3 WEB HOSTING

A web hosting service (often shortened to web host) is a type of Internet hosting

service that allows individuals and organizations to make their website accessible
via the World Wide Web. Web hosts are companies that provide space on
a server owned or leased for use by clients, as well as
providing Internet connectivity, typically in a data center. Web hosts can also
provide data center space and connectivity to the Internet for other servers
located in their data center, called colocation, also known as housing in Latin
America or France. (Wikipedia). A certain duration in which the website can be
hosted is given according to the amount paid for.

TYPES OF HOSTING SERVICES

Shared web hosting service

One's website is placed on the same server as many other sites, ranging from a
few sites to hundreds of websites. Typically, all domains may share a common
pool of server resources, such as RAM and the CPU. The features available with
this type of service can be quite basic and not flexible in terms of software and
updates. Resellers often sell shared web hosting and web companies often have
reseller accounts to provide hosting for clients.

Reseller web hosting

Allows clients to become web hosts themselves. Resellers could function, for
individual domains, under any combination of these listed types of hosting,
depending on who they are affiliated with as a reseller. Resellers' accounts may
vary tremendously in size: they may have their own virtual dedicated server to a
collocated server. Many resellers provide a nearly identical service to their
provider's shared hosting plan and provide the technical support themselves.

Dedicated hosting service

The user gets his or her own Web server and gains full control over it (user
has root access for Linux/administrator access for Windows); however, the user
typically does not own the server. One type of dedicated hosting is self-managed
or unmanaged. This is usually the least expensive for dedicated plans. The user
has full administrative access to the server, which means the client is responsible
for the security and maintenance of his own dedicated server.

Managed hosting service

The user gets his or her own Web server but is not allowed full control over it
(user is denied root access for Linux/administrator access for Windows); however,
they are allowed to manage their data via FTP or other remote management
tools. The user is disallowed full control so that the provider can guarantee quality
of service by not allowing the user to modify the server or potentially create
configuration problems. The user typically does not own the server. The server is
leased to the client.

Cloud hosting

This is a new type of hosting platform that allows customers powerful, scalable
and reliable hosting based on clustered load-balanced servers and utility billing. A
cloud hosted website may be more reliable than alternatives since other
computers in the cloud can compensate when a single piece of hardware goes
down. Also, local power disruptions or even natural disasters are less problematic
for cloud hosted sites, as cloud hosting is decentralized. Cloud hosting also allows
providers to charge users only for resources consumed by the user, rather than a
flat fee for the amount the user expects they will use, or a fixed cost upfront
hardware investment. Alternatively, the lack of centralization may give users less
control on where their data is located which could be a problem for users
with data security or privacy concerns as per GDPR guidelines. Cloud hosting users
can request additional resources on-demand such as only during periods of peak
traffic, while offloading IT management to the cloud hosting service.

3.0.4 FRONT-END DEVELOPMENT (WEB DESIGN)

Front-end web development, also known as client-side development is the
practice of producing HTML, CSS and JavaScript for a website or Web
Application so that a user can see and interact with them directly. The challenge
associated with front end development is that the tools and techniques used to
create the front end of a website change constantly and so the developer needs
to constantly be aware of how the field is developing.

The objective of designing a site is to ensure that when the users open up the
site they see the information in a format that is easy to read and relevant. This
is further complicated by the fact that users now use a large variety of devices
with varying screen sizes and resolutions thus forcing the designer to take into
consideration these aspects when designing the site. They need to ensure that
their site comes up correctly in different browsers (cross-browser), different
operating systems (cross-platform) and different devices (cross-device), which
requires careful planning on the side of the developer. A front-end developer
architects and develops websites and applications using web technologies
(i.e., HTML, CSS, DOM, and JavaScript), which run on the Open Web Platform or
act as compilation input for non-web platform environments (i.e., React Native).

Figure 3 pic of a developer working

Image source:  https://www.upwork.com/hiring/development/front-end-

developer/

Typically, a person enters into the field of front-end development by learning to

develop HTML, CSS, and JavaScript which commonly runs in a web browser but
can also run in a headless browser, Web View, or as compilation input for a
native runtime environment. These four run times scenarios are explained
below.

HTML CSS AND JAVASCRIPT

HTML stands for Hyper Text Markup Language. HTML elements are the building
blocks of HTML pages. It is the standard language for documents designed to be
displayed on a Web browser. It can be written on any text editor such as
Notepad, Visual Studio Code, and Sublime Text etc. HTML is a very easy
language to write and understand, HTML elements are represented by <> tags
which are used to enclose normal texts or information that is to be displayed on
the web browser. Some examples of these tags are <html></html>,
<body></body>, <title></title> and so much more. All tags can have attributes,
attributes define additional characteristics or properties of the element such as
width and height of an image. For instance, an anchor tag <a></a> which is used
for defining links in html must always come with the href attribute, the value of
the href attributes contains the URL (Uniform Resource Locator) of where you
want that link to go to. E.g.

<a href =www.google.com>clikc here</a>.

The most important attributes in html are ID and CLASS. Classes can be assigned
to more than one elements while IDs cannot. These two attributes are what is
used to style an element in CSS

CSS stands for Cascading Style Sheet. It is used to design how the HTML is
displayed. Without CSS, the website will be ugly and disorganized. In CSS we use
selectors to assign styling to an html element. For classes, “.class name” is used
for styling elements with the Class attribute while for elements with ID attribute
“#ID name” is used. Classes or ID’s can take any name and can be called
anywhere in CSS. You can also style elements by just using their element for
example say you want to style a <h4></h4> element, this is how your CSS would
like;

h4{
color: red;

}
Notice the curly braces, semicolon and the colon, they are very important and
must always be used when styling an element. There is a CSS framework called
BOOTSTRAP. Bootstrap is a free and open-source CSS framework directed at
responsive, mobile-first front-end web development. It contains CSS- and
JavaScript-based design templates for typography, forms, buttons, navigation, and
other interface components (Wikipedia). It helps developers in styling html pages
easily and faster.

JAVASCRIPT is a text-based programming language used both on the client-side

and server-side that allows you to make web pages interactive. Where HTML and
CSS are languages that give structure and style to web pages, JavaScript gives web
pages interactive elements that engage a user. Common examples of JavaScript
that you might use every day include the search box on Amazon, a news recap
video embedded on The New York Times, or refreshing your Twitter feed.
JavaScript is used for Adding interactive behavior to web pages, Creating web and
mobile app, Building web servers and developing server applications, game
development etc.

3.0.5 BACKEND DEVELOPMENT

Backend Development is also known as server-side development. It is everything

that the users don’t see and contains behind-the-scenes activities that occur
when performing any action on a website. It focuses primarily on databases,
backend logic, APIs, and Servers. The backend of a website is a combination of
servers, applications, and databases. Code written by backend developers helps
browsers in communicating with the databases and store data into the database,
read data from the database, update the data and delete the data or information
from the database. A backend developer is one who makes use of the technology
required to develop the products for the backend of any website. A backend
developer is responsible for building the structure of a software application.

Backend developers typically work in groups or with a team. Large teams include
both backend and frontend developers where both the developers collaborate to
develop viable products. Backend developers collaborate with frontend
developers, principal architects, product managers, and testers to contribute their
part and develop a product. Backend developers use various kinds of tools,
languages, and frameworks to accomplish these tasks. To do all this, they use a
variety of server-side languages, including Java, .NET, PHP, Ruby, Node.JS, and
Java. They also use tools like MySQL, Mongo DB, Oracle, and SQL server to create,
read, update or delete data and serve it back to the client-side or the frontend of
the application.

Backend Programming Languages

There are two kinds of backend programming languages –

Object-oriented (OOP) – It is a programming architecture built upon the concept

of classes and objects. It is used to structure a program into simple, reusable
pieces of code snippets (called classes), which are then used to create individual
instances of objects. A class is an abstract blueprint that is used to create more
concrete and specific objects. And objects are the instances of a class. In object-
oriented programming languages, statements are executed in a particular order.
Some of the popular object-oriented backend languages include Python, Java, and
.NET.

Functional – Functional programming is a programming paradigm in which

everything is bound in mathematical functions style. It is a way of software
development by creating pure functions. Functional programming languages
avoid the concepts of shared state and mutable data that is observed in OOP.
They emphasize expressions and declarations rather than execution. Functional
programming languages use declarative syntax, which suggests that statements
are often executed in random order. Some examples of functional languages
include Haskell, Closure, SQL, and R.

3.0.6 PHP

PHP stands for Hypertext Preprocessor. It originally stood for Personal Home
Page. This was the main language we used at Uleval Technology for backend.
The senior engineer used both node and PHP.

PHP code is usually processed on a web server by a PHP interpreter implemented

as a module, a daemon or as a Common Gateway Interface (CGI) executable. On a
web server, the result of the interpreted and executed PHP code – which may be
any type of data, such as generated HTML or binary image data – would form the
whole or part of an HTTP response. Various web template systems, web content
management systems, and web frameworks exist which can be employed to
orchestrate or facilitate the generation of that response. Additionally, PHP can be
used for many programming tasks outside of the web context, such as
standalone graphical applications and robotic drone control. PHP code can also be
directly executed from the command line.

PHP has various types of frameworks with inbuilt functions which makes coding
PHP easier, examples of this frameworks are Code Igniter and Laravel.

3.1 WORDPRESS

WordPress is a free content management system written in PHP and used with
MySQL database (or Maria DB). WordPress was first designed for publishing
blog sites but as time went it became more than just a platform for creating
blogs. Now WordPress can be used to create static websites, Ecommerce
websites, school management systems and lot more. WordPress makes use of a
Plugin architecture and a Template system referred to themes.
WordPress' plugin architecture allows users to extend the features and
functionality of a website or blog examples of a plugin is Elementor, Elementor
Website builder allows WordPress users to create and edit websites by employing
the drag and drop technique, with a built-in responsive mode. Elementor comes
with different interesting features, it has a feature that gives users the ability to
add custom CSS or custom HTML to their WordPress site. WordPress also allow
users create custom plugins for features that are not available in the plugin
market. Since WordPress was created with PHP the plugins can only be written in
PHP.
WordPress has another feature which is a template system called themes.
Themes is a feature of WordPress which allows users to change the appearance of
a website with just few click. It can come with menus, pages and even custom
contents. In summary Themes change appearance of a WordPress site while
plugins extends functionality.
WordPress uses a MySQL database system which comes with XAMPP. XAMPP is
an abbreviation for cross-platform, Apache, MySQL, PHP and Perl, and it allows
you build WordPress sites offline using the apache server that comes with it.
Without XAMPP you will not be able to run WordPress. Below is a picture of a

Figure 5
4 Pic
PIC of
of axampp
xamppserver
server
XAMPP server
 CHAPTER FOUR
NO CODE APPS/VISUAL PROGRAMMING

4.0 NO CODE APPS

No code application is a new system that allow programmers and non-
programmers to create application software through graphical user interfaces and
configuration without writing any code. No Code Apps are used to meet the
needs of companies that are seeking to digitize processes through cloud-
based mobile applications. No-code tools are often designed with line of
business users in mind as opposed to traditional IT. This shift in focus is meant to
help accelerate the development cycle by bypassing traditional IT development
constraints of time, money, and scarce software development human capital
resources to allow teams to align their business strategy with a rapid
development process. No Code Apps also often leverage enterprise-scale APIs and
web service catalogs, open data sets, and tested and proven template galleries, to
help integrate existing business systems while adding a practical layer of user
functionality. The potential benefits of utilizing No Code Apps is Access, Agility
and Richness.

4.0.1 TYPES OF NO CODE APPS

There are different types of No Code Applications arising in this present day and
each with their own specific way of creating applications. Some examples are;
 1. Glideapps. Creates a mobile app by using just a spreadsheet.
2. Adalo. Create a mobile app - as easily as putti ng together a slide
deck.
3. Bubble. Bubble enables anyone to design, develop, and launch
powerful web apps without writi ng code.
4. Xano. The Fastest way to build a Backend without code

Bubble.is would be my major focus in this report because that what I was
assigned to at Uleval Technology. I carried out various projects with bubble of
which is stated in chapter 5.

4.0.2 BUBBLE.io
Bubble is a visual programming language, a no-code development platform and
an application platform as a service, developed by Bubble Group that enables
non-technical people to build web applications without needing to type code
(Wikipedia).

Bubble interface has many tools with different functions. First a design section
which has many options for designing applications, it consists of Visual elements
(which contains elements for adding text, buttons, images, shapes etc. to your
application), Containers (groups, repeating groups, popups etc.), Input Forms,
Reusable elements and templates. The next section in bubble is the Workflow.
Bubble workflows are used to program Bubble applications so that your
application has completely custom functionality. Workflows are used to define
what happens when users interact with your application (e.g., workflows can save
information that the User just typed, save User’s preferences, save information
about a User, show a popup, show an alert, send an email, charge a User’s credit
card, record an analytics event, connect with thousands of external APIs, and
more). A workflow consists of two parts: an event, and 1 or more actions. Events
are the part of workflows which tell Bubble when certain workflow actions should
be run. When an event is true, Bubble will run that event’s actions. In contrast,
when an event does not evaluate to be true, Bubble will not run that event’s
actions. In other words, workflows are similar to If then statements. The actions
are what the app does.

After the workflow we have the Data section. This is where data types, fields and
data structures as a whole is created in bubble. The next section is Styles, a bit
similar to CSS bubble styles allows users to create styling, save them and reuse
them when designing your application or project. Other sections in the toolbar are
Plugins, Settings and logs. In the next page you would see a picture of the bubble
interface.
Figure 5 Bubble interface

A picture of Bubble’s interface

4.1 VISUAL PROGRAMMING (SCRATCH)

Visual programming is a type of programming language that lets humans describe
processes using illustration. At uleval technology our many focus was to use visual
programming to introduce kids to programming as it is very easy to learn and
understand. What we used was a visual programming software called SCRATCH.

Scratch is a high-level block-based visual programming language targeted

primarily at children 8-16 as an educational tool for coding. Users on the site,
called Scratchers, can create projects on the web using a block-like interface.
Scratch was created by the Massachusetts Institute of Technology (MIT). Users of
this application are called Scratchers, they can communicate with each other and
share what they have done through the platform. Projects done on scratch can be
exported to HTML5, Android apps and EXE files using external tools. Since scratch
is block based it comes with several types of inbuilt which you can use to create
programs such as a simple game. It has Motion blocks(movement), Look
blocks(appearance), Sound blocks, Event blocks(action), Control
Blocks(conditional/looping functions), Sensing blocks(for detecting things),

Operator Blocks (Mathematical/logical), and variable blocks. Scratch also provides

a feature that allows users to also create their own custom blocks. Scratch comes
with backdrops and sprites, sprites are characters used when developing a
program in scratch while backdrops are images which can be used as backgrounds
in your program (e.g. Game).
In conclusion, visual programming/No code apps may not phase out traditional
programming but are very powerful tools which are easy and can be very handy

Figure 9
6 Scratch interface
8
when it comes to creating MVPs (Most Viable Products).

A picture of the scratch app

 CHAPTER FIVE
POJECTS, SKILLS ACQUIRED & CHALLENGES

5.0 The Ray Online Project

The Rayon line project was the first task I was assigned to at Uleval technology. It
was a collective project which was used to test our basic knowledge of HTML and
CSS. We were told to use any CSS framework for the project. Ray Online is a
blogging site that had already been created by our supervisor, he sent us a screen
shot of the UI and told us to recreate it with code

To achieve this project I used was Visual Studio Code as my text editor, HTML and
I chose BOOTSTRAP.css as my CSS framework. Below is the screenshot of the blog

Figure 11
7 Rayoo oline project

Screen of original ray online blog

Skills Acquired: From this ray online project I learnt new ways to use bootstrap in
styling my website and it made me more aware of the numerous classes bootstrap
has. I also learnt how to get a domain name and host a website online.

Challenges: I faced a challenge when I was trying to recreate a trapezium shape on

the shape but solved the issue later on. Another challenged I faced was that when
I uploaded to file to a server online it took time to load on other people’s phone
because of the picture is used had a very high quality.

Below are some screenshot of my project

Figure 13
8 Visual studio code
 My Rayoo online site

5.1 Bubble Projects

5.1.0 Personal Shopper

This is an online store which allow users to order the celebrity outfits. It has a
section that displays different artistes and celebrities putting on an outfit, here a
user can choose to buy exactly all the outfit the celebrity is wearing. It also has a
blogging section where you can see latest entertainment news and also has a
tourism section.

This project was assigned specifically to me and a co-worker. We used bubble to

carry out this project, the aim was to create a working prototype which would use
to show the client how the site would look before building the site with codes,
and this was also done so that the client can make corrections early. The UI of the
site was first designed by the creative department and sent to us to replicate in
bubble. At the end we transferred the

Skills Acquired: Learnt how to design and build a static website with bubble.io.
Understood how to covert designs into to full working prototypes on bubble

Challenges: The major challenge of this project was that we were told to deliver it
in a day. Although I have worked on smaller projects with bubble, I had not built a
website with multiple pages but we overcame.
Figure 16
10 Bubble interface

Bubble Interface (left), Personal shopper site (right)

5.1.1 Tinder Clone

This was my first major project on bubble. Assigned to me personally I was told to
build a dating app like Tinder, this was very challenging because I had not done
anything on bubble before and there were not very much resources online so I
had to figure out most things on my own.

The tinder clone I built was an app where a logged in user sees the profile of
multiple users and can swipe left or right, Left for people the user dislikes and
right for people he likes. If the user likes a person that was liked before then a
match is created.

Skills Acquired: I understood bubble’s workflow better, it also helped me

understand a little bit about what happens at the backend of an app even if I
didn’t code. It improved my logical reasoning since I had to figure out how to link
the data on my own. I learnt how to use a repeating group.
Challenge: I faced so many challenges in this project, first trying to link the design
with the database. I faced another challenge trying to create user accounts and
many more but I overcame them with the aid of proper research.

Pictures of the tinder project (below)

Figure 11

5.2.1 Todo Application

This was a project where we worked with both a database and a PHP framework
Code Igniter. The Todo app is able to accept data, store data into the database,
display the data from the database, update data in the database and delete data.
We first built it in pure PHP and then the same project was used to introduce
code igniter to us.

Code Igniter is a powerful PHP framework with a very small footprint, built for
developers who need a simple and elegant toolkit to create full-featured web.
Like every other framework it uses MVC pattern. MVC stands for Model View
Controller. It is a pattern in software design commonly used to implement user
interfaces, data, and controlling logic. It uses OOP but is very easy to understand
because it had inbuilt functions which solved problems that would take long to do
in PHP with just few clicks. The language we used for our database was MySQL
and phpmyadmin was used to create the database.

In carrying out this project I first had to create a database using phpmyadmin that
comes with xampp. Then I created a model in code igniter and linked the model
to my database, once this was done we went on to implement PHP codes that
would perform all the functions needed since we had already designed the
frontend of the site earlier.

Skills Acquired: I learnt how to use a PHP frame work and how to create a
database connection with MySQL.

Challenges: It was tuff trying to understand how to use a framework for the first
time

Figure 12
 Image of my Todo app

5.3 WordPress Project

Working with WordPress was another time where I got to work on a live project.
We were allowed to work on the company’s site. I designed two pages using the
Elementor page builder and a theme created by

Skills Acquired: Learnt how to use Elementor. Learnt how to install WordPress on
a life server (not local host).

Challenge: The only problem I faced was that WordPress is not that flexible so I
had to us custom HTML to achieve some design ideas.

CHAPTER SIX
SUMMARY (CONCLUSION & RECOMMENDATIONS)
6.0 CONCLUSION
In conclusion I had a great time at Uleval technology and was able to acquire
many important skills not just computer engineering skills but also inter-personal
skills, how to work with and organization and much more. I had the opportunity
to apply the theoretical knowledge acquired from school in real life problems. My
training here has given me a broader view to the importance and relevance of
one of the fields in the department of Computer Engineering, web development.

The SIWES scheme is aimed at exposing students to real life working

environment, enable them to put into practice what they have learnt in class,

enlightening the to understand the technical implication of their profession as

well as teaching competence, standard and professionalism.

6.1 RECOMMENDATIONS
In view of the benefits of SIWES program, it is important that it is sustained
by Federal Government through Industrial Training Fund (ITF) as it exposes the
student to work tools, facilities and equipment that may not be available in
respective institutions in relation to course of study. To this end, I recommend
that the following points should be implemented:

 Schools should provide a place of attachment for students as its hard for
them to do it on their own.
 There should be proper supervision of students concerned by both ITF
officials and the Institution based supervisors at least once a month.
  Allowances should be paid to the students during their program just like
NYSC and not after. This would help the students to handle some financial
problems during their training course.
 The companies should put in place all necessary facilities needed to
enhance the knowledge of students in Industrial attachment.
 There should be alliance between ITF and companies for proper placement
of students.

REFERENCE
 Wikipedia
 Uleval Company Profile
 https://en.wikipedia.org/wiki/Web_development
 https://frontendmasters.com/books/front-end-handbook/2018/what-is-a-
FD.html
 https://en.wikipedia.org/wiki/Front-end_web_development
 https://www.wpbeginner.com/beginners-guide/beginners-guide-what-is-a-
domain-name-and-how-do-domains-work/
 https://www.w3schools.com/whatis/.asp
 https://www.hackreactor.com/blog
 https://www.interviewbit.com/blog/backend-developer-skills
 https://en.wikipedia.org/wiki/PHP
 https://en.wikipedia.org/wiki/No-code_development_platform
 My intuition. LOL