A TECHNICAL REPORT

ON

STUDENTS INDUSTRIAL WORK EXPERIENCE SCHEME

(SIWES)
AT

RAOATECH IT-ELECTROMECH LIMITED

1A HUGHES AVE, ALAGOMEJI, YABA, LAGOS
DURATION: 23rd JANUARY, 2023 – 31st JULY, 2023

BY

OLATUNJI SHARON DAVID

170408007

SUBMITTED TO:
DEPARTMENT OF COMPUTER ENGINEERING
FACULTY OF ENGINEERING,
UNIVERSITY OF LAGOS, AKOKA.
 CERTIFICATION

I, Olatunji Sharon David, a student of the Department of Computer Engineering, University

of Lagos, Akoka, with matriculation number 170408003, hereby certify that this Industrial
Training report was prepared and compiled by me as a summary of my experience on
completion of my six-month industrial training at Raoatech IT-Electromech Limited, located
at 1a, Hughes Ave, Alagomeji, Yaba, Lagos, from 23rd of January to 31st of July, 2023.

___________________________________________
Signature & Date
Student, Olatunji Sharon David

___________________________________________
Signature & Date
Institution Based Supervisor, Dr. F.L. Ogboi

i
 ACKNOWLEDGMENT

My absolute and sincere gratitude and appreciation to God Almighty, who in His good grace
and love, guided, helped and supported me through the duration of my now completed six-
month internship program.

Special appreciation to my parents, Mr. and Mrs. Olatunji, for their continued and relentless
love, support and guidance, which have largely contributed to my placement and successful
completion of my industrial training.

I also must express my heartfelt appreciation to Raoatech-IT Electromech, and her CEO Mr.
Oludare Olarenwaju, for the privilege and opportunity build, grow and learn in the software
engineering ecosystem. I am most thankful for their support, guidance and tutelage in a
variety of skills, most especially pushing me to build and sharpen my leadership, soft and
people skills, which of course is asides software development skills and practices itself.
Shout also to my colleagues, Otokiti Fisayo, Onuwuasoanya Joshua, Okpara Daniel,
Oladipupo Stephen, Adebiyi Seminire, Okoghenun Confidence and Ademola Riliwan on the
software engineering team, for their recognized contribution the success and completion of
the internship.

My appreciation goes to the Central Industrial and Liaison Placement Unit (CILPU) and
Industrial Training Fund for having the vision to start this program, which aims to help
students mix theoretical information gained in the classroom with practical, hands-on
applications of knowledge needed to conduct industry tasks.

Finally, I would like to express my gratitude to the SIWES Coordinator, Engineer Odekunle,
my institution-based supervisor, Dr. F.L Ogboi, and the entire staff of the
Electrical/Electronics Engineering Department, University of Lagos, for instilling knowledge,
skills, and values in me prior to participating in this program.

Olatunji Sharon D.

ii
 DEDICATION

I dedicate this report to God Almighty, who has been my absolute source of strength,
inspiration, guidance and life in its entirety, through which I was able to start and
successfully complete this SIWES journey. Dedication also to my family, who have
relentlessly been my anchor, guide and support. Lastly, I dedicate this report to Raoatech-IT
Electromech for all of their love and support during my industrial training at their prestigious
firm.

iii
 ABSTRACT

This report is based solely on my Industrial Work Experience program at Raoatech IT-
Electromech, in partial fulfillment of the award of Bachelor’s Degree in Computer
Engineering, University of Lagos.

The Students' Industrial Work-Experience Scheme (SIWES) is a program aimed at improving

students' vocational abilities in higher education institutions. This is accomplished by
providing students with opportunities to apply their academic knowledge in real-world
settings, bridging the gap between theory and practice.

Raoatech IT-Electromech is an applied computer science research and development company

that leverages cutting-edge technologies to tackle locally relevant challenges. This report
describes the experience gathered during my six-month industrial training at Raoatech IT-
Electromech towards this objective.

The report begins with the introduction of SIWES and its goals. It then goes into detail about
Raoatech IT-Electromech, including who they are and what they do. It describes the work
done, the knowledge gained, and the challenges encountered during the training. It relates the
work done to its relevance in Computer Engineering. It also tries to justify the scheme's
importance in providing students with the skills they need to succeed in the industry after
graduation.

iv
 TABLE OF CONTENTS

Certification ....................................................................................................................... i

Acknowledgment ............................................................................................................... ii

Dedication .......................................................................................................................... iii

Abstract .............................................................................................................................. iv

Table of Contents ................................................................................................................ v

List of Figures .................................................................................................................... viii

List of Abbreviations ......................................................................................................... x

CHAPTER ONE: INTRODUCTION................................................................................ 1

1.1 – What is SIWES? ................................................................................................. 1
1.2 – History of SIWES ............................................................................................... 2
1.3 – Aim and Objectives of SIWES ........................................................................... 2
1.4 – Benefits of SIWES .............................................................................................. 3

CHAPTER TWO: COMPANY BACKGROUND............................................................ 4

2.1 – Overview of Raoatech IT-Electromech .............................................................. 4
2.2 – Core Values ........................................................................................................ 4
2.3 – Departments ........................................................................................................ 5
2.4 – Services offered .................................................................................................. 6
2.5 – Products ............................................................................................................. 6
2.5.1 – ANST Membership Portal ................................................................... 6
2.5.1 – SchoolKia ............................................................................................. 7

CHAPTER THREE: WORK EXPERIENCE ................................................................. 11

3.1 – Software Processes ............................................................................................. 1

CHAPTER FOUR: DISCUSSION AND ANALYSIS...................................................... 0

4.1 – Discussion ........................................................................................................... 0

v
 4.2 – Skills acquired during training ........................................................................... 0
4.3 – Relevance to academic discipline ....................................................................... 0
4.4 – Relevant Courses ................................................................................................ 0
4.5 – Challenges encountered ...................................................................................... 0

LIST OF FIGURES

Figure 2.1 –

LIST OF ABBREVIATIONS

SIWES - Students Industrial Work-Experience Scheme

CILPU - Central Industrial and Liaison Placement Unit

ITF - Industrial Training Fund

HTML - HyperText Markup Language

CSS - Cascading Style Sheets

JS - JavaScript

NUC - National Universities Commission

R&D - Research and development

SOI - Service Operations and Improvement

NGO - Non-Governmental Organization

API - Application Programming Interface

OSI - Open Systems Interconnection

TCP - Transmission Control Protocol

IP - Internet Protocol

FTP - File Transfer Protocol

HTTP - HyperText Transfer Protocol

vi
HTTPS - HyperText Transfer Protocol Secure

SMTP - Simple Mail Transfer Protocol

SSL - Secure Sockets Layer

UDP - User Datagram Protocol

MAC - Media Access Control

LAN - Local Area Network

OS - Operating System

PC - Personal Computer

VCS - Version Control System

LVCS - Local Version Control System

CVCS - Centralized Version Control System

DVCS - Distributed Version Control System

TS - TypeScript

IT - Information Technology

IBM - International Business Machines

JSX - JavaScript XML

XML - Extensible Markup Language

DOM - Document Object Model

VDOM - Virtual Document Object Model

XSS - Cross-site scripting

UI - User Interface

UML - Unified Modeling Language

vii
 CHAPTER ONE: INTRODUCTION

1.1 What is SIWES?

The Students Industrial Work Experience Scheme (SIWES) was established by the Industrial
Training Fund (ITF) in 1973. The Students Industrial Work Experience Scheme (SIWES) is a
recognized skills training program that is part of the approved minimum academic
requirements in a variety of degree programs provided by all Nigerian universities. It was
established to bridge the gap between theory and practice in engineering, technology, science,
agriculture, medicine, management, and other professional educational programs at Nigerian
Tertiary Institutions.

Prior to the creation of the scheme, there was a rising concern among our industry leaders
that graduates of higher learning institutions lacked enough practical background studies to
prepare them for employment in the industry. The motivation for initiating and creating the
system was based on this context. As a result, the program provides students with the chance
to get familiar with and gain expertise with equipment and apparatus that are often not
available at their universities.

Employers were unsatisfied with the solely theoretical education provided by higher
education institutions, claiming that it was unresponsive to their demands as labor employers.
The SIWES for engineering and technology has a minimum length of 24 weeks (6 months).
The SIWES curriculum is designed to help students prepare for the job market. In Nigeria, it
has become a unique phenomenon in terms of human resource development and training.

Its goal is to expose pupils to machinery and equipment, as well as professional work
practices and safety measures for workers in industries and other organizations. The concept
is a three-part initiative combining students, institutions, and businesses (employers of labor).
The Federal Government of Nigeria funds it, and the Industrial Fund (ITF) and the National
Universities Commission collaborate to coordinate it (NUC).

1
1.2 History of SIWES

The Industrial Training Fund (ITF) established the Student Industrial Working Experience
Scheme (SIWES) in 1973 as a way of combining theory with practical experience, which was
lacking in our educational system. As a result, the plan was a skill-training program aimed to
expose and prepare students for jobs they may encounter in their post-graduate efforts.

ITF was founded as a federal government parastatal by decree 47 of 1971, with the mission
of developing and supporting the acquisition of skills in industry and commerce in order to
create a pool of inventive trained workforce adequate to satisfy the economy's demands.

In 1978, the fund included a section in its policy statement number one that addressed the
issue of practical skills among locally trained professionals. "Great emphasis will be made on
specific products of post-secondary education to adapt or orientate readily on their probable
post-graduation for the environment," according to Section 15 of the policy.

The fund will work with the industry to develop cooperative machinery in which students
will be taught in the industry on commerce related to their field of study. The fund would
help students with modest career attachment by contributing to their allowances and other
benefits. As a result, the plan was created to give much-needed practical experience to
students enrolled in all courses that need exposure to industry operations, as well as to foster
much-desired technical expertise.

The skills and competencies gained by students who participate diligently in the Students
Industrial Work Experience Scheme (SIWES) are the most significant advantage. The
participants of industrial training retain their applicable manufacturing abilities as lifelong
assets that cannot be taken away. This is due to the fact that information and abilities
obtained during training are internalized and become useful while performing professions or
duties

1.3 Aim and Objectives of SIWES

2
The objectives of SIWES were specified in the Industrial Training Fund’s Policy of 1973,
which founded the scheme.

They are:

1. Provide a way for students at higher education institutions to get industry skills and
experience throughout their studies.
2. Prepare students for the types of industrial job conditions they may encounter after
graduation.
3. Introduce students to equipment and machinery handling procedures and techniques
that may not be available at their institutions.
4. Make the transition from school to work simpler for pupils and improve their
networks for future career placements.
5. Give students the opportunity to apply what they've learned in class to real-world
settings, bridging the gap between theory and practice.
6. Use SIWES to enlist and improve employers' participation in the whole educational
process.

1.4 Benefits of SIWES

The major benefits gotten from participating in the SIWES program are the skills and the
proficiency in those skills they acquire. This is due to the fact that students' information and
abilities obtained via training are absorbed and applied throughout work performance or
functions. However, there are several other benefits to be gotten by participating in industrial
training.

Some of them include:

1. Students learn how to communicate successfully in a professional setting.

2. It teaches students how to get along with their coworkers and bosses.
3. It gives students the chance to learn about professional and ethical responsibilities.
4. It allows students to complement theoretical information learned in the classroom
with practical knowledge gained in the workplace.
5. It assists students in developing good work habits.
6. It broadens students' knowledge of the world of employment.

3
 CHAPTER TWO: COMPANY BACKGROUND

2.1 Overview of Raoatech IT-Electromech

Raoatech IT-Electromech is a edtech/fintech firm specializing in applied computer science

research and development. The company which is primarily concerned with research and
development uses its combined knowledge of computer science and engineering to create
new products or solutions that will have a greater beneficial influence on herself, people and
other companies.

Raoatech IT-Electromech CEO, Mr. Oludare Olarenwaju, is a serial IT entrepreneur with

over 15-year experience in management of design, development, testing and other aspects of
enterprise software solutions' lifecycles for sectors such as education, TAX /revenue
collection for government and corporate organizations, aviation, lottery and gaming, military,
etc.

Raoatech IT-Electromech has trained over 10,000 African youths (in pre-schools, K-12,
higher institutions and professionals) on 4th industrial revolution’s tech skills (e.g. STEM-
based Robotics and Coding, Data Science, Software Testing) in different parts of Nigeria and
United Kingdom(online-based), in the last 7 years. Raoatech as a company, believes that
young Africans can achieve great things if their passion and skill are nurtured, hence I and
my colleagues were given this internship opportunity. The majority of the employees who
have worked at Raoatech started as engineering interns who were rigorously taught and
closely coached. In addition to their tasks, they have a culture of lifelong learning and
growth, and everyone has a personal development plan that they follow in addition to their
responsibilities. They've been following this strategy since the beginning, and their graduates
are making waves in their respective professions.

4
2.2 Company Focus

Raoatech IT-Electromech focuses and specializes in the following areas:

1. Design and development of enterprise software solutions (mobile and web-based)

2. Quality assurance/software testing
3. Security and safety solutions (CCTV/access control/burglar alarm systems) and
4. Human capital development by offering world-class trainings to youths and other
professionals in the areas of fourth industrial revolution's technologies such as

5
 robotics, coding, drone technology, internet of things (IoT), data science, artificial
intelligence

2.3 Departments

There are seven main departments that make up the company's core departments. These
divisions are concerned with their responsibilities in relation to the company's overall growth
and success.

They are:

1. Business: They are responsible for the company's day-to-day operations, as well as its
growth, strategy, and revenue. Finance, human resources, logistics, and operations, as
well as data collection and statistical analysis of how Raoatech services are
performing in the market, are all handled by them. They also handle the process of
reselling some of the products to other businesses.

2. Service Operations and Improvement (SOI): This group provides technical

assistance for the services that are already in place. They include the actions,
procedures, and infrastructure that is responsible for delivering value to the business
through technology on a daily basis.
3. General Operations: The direct and organize the actions of the company or the
departments involved in product production, pricing, sales, and distribution. They
manage employees by creating work schedules and assigning particular
responsibilities.

4. Product Management: They are in charge of both product development and

marketing. To deliver winning products, this entails managing the product across the
Product Lifecycle, collecting and prioritizing product and customer needs, creating
the product vision, and collaborating closely with engineering.

5. Engineering: They code, and find out how coding and software engineering can be
done better. They would help service and speed up several projects going on at

6
 Raoatech. They design, develop, maintain, test, and evaluate software using software
engineering concepts.

6. Research and Development (R&D): They are in charge of overseeing research and
developing knowledge-based goods for the company. The R&D department's primary
goal is to assist the firm in maintaining its competitiveness. This involves keeping an
eye on emerging trends as well as what competitors are up to.

7. Design (Product Design): They are in charge of the development and design of
consumer products. This role's responsibilities include enhancing existing product
designs and assessing working concepts introduced by competitors of similar products
to ensure that quality and performance are comparable.

2.4 Services offered

Raoatech IT-Electromech service offerings include:

1. Web design and hosting

2. Mobile application development
3. Database design and programming
4. IT consultancy
5. Telecommunication solutions and system integration
6. Digital business development
7. Real-time analytics and visualization\
8. Security and safety solutions (CCTV, Burglar alarm systems)
9. Training

They have provided solutions to individuals and organizations in various fields including
Education, Venture Capital, Health, Public Service and Governance, Entertainment,
Telecommunications, Religion, Retail, and Logistics.

2.5 Products

7
The following are some products that Raoatech have built in the past or currently maintain.
They are:
2.5.1 ANST Membership Portal
As a company that offers software testing and quality assurance services, Raoatech is
responsible for developing a web-based application product for the Association Of Nigerian
Software Testers. A membership web application to oversee and coordinate the affairs and
activities of the association.

Figure 2.5.1 – ANST Landing Page

2.5.2 SchoolKia

As an edtech inclined company, passionate about training and impacting knowledge,

schoolkia is a learning management system and school management solution. schoolkia
provides an e-learning environment, result management, student bills and payment
management solution, attendance management, correspondence and public relations to
mention but a few.

8
 Figure 2.5.2 – SchoolKia Landing Page

CHAPTER THREE: WORK EXPERIENCE

At Raoatech, I worked as a software engineering intern, and as a result, I was assigned to the
software team, where I majored in the Front-end web development field. The software team
was in charge of all development tasks required to create a fully functional software product.
Software solutions, database migrations, debugging, code testing and validation, code
refactoring, implementation of application programming interfaces (APIs), documentation,
and maintenance were among the needs.

A software engineer, according to Wikipedia, is a person who uses software engineering

concepts in the design, development, maintenance, testing, and evaluation of computer
software. Also, it describes software engineering as the systematic application of engineering
to the production of software. It is also known as software development or programming in
general. The subchapters in this section provide insight and information about each assigned
task, tool utilized, skill and concept learned during my training, as they all add up to my
industrial experience.

9
3.1 Software Processes

A software process is a collection of interconnected activities that culminate in the creation of

a software product. These efforts might include creating software from the ground up or
changing an existing system. There is no perfect software development process, and several
companies have established their own methods. Any software development process, however,
must incorporate the following four steps:

1. Software Specification (Requirements Engineering): This is the process of

determining and specifying the services that are necessary, as well as the restrictions
that these services must meet.

2. Software Design and Implementation: The process of translating a system

specification into an executable system is known as the implementation phase of
software development. The architecture of the program to be developed, the data that
is part of the system, the interfaces between system components, and, in certain cases,
the techniques employed are all described in this design.
3. Software verification and validation: This is used to demonstrate that a system
complies with its specifications as well as the customer's expectations.

4. Software evolution (Software Maintenance): This is the process of continuously

modifying software over time in response to changing needs and customer demands.

3.3 Version Control

This report fails to be complete without an overview of the concept and importance of
version control as version control is the bedrock of development, deployment, continuous
integration and collaboration on any successful project and was duly employed across all
projects owned and managed by Raoatech IT-Electromech.

Version control systems (also known as revision control or source control) are a group of
software tools and techniques that allow individuals and teams to maintain track of every
change and various versions of software, content, documents, websites, and other material
under development. It allows and combines concurrent work on a single project. Each team
member modifies their own copy of the files and decides when to share their modifications
with the rest of the group. Version control keeps track of each contributor's specific changes

10
and helps avoid work from clashing. It is frequently possible to integrate edits to several files,
or even the same file, without losing information. When there are conflicts between
modifications, the version control system flags them and asks for human help in choosing
what to do.

3.3.1 Types of Version Control

The following are types of version control systems, classified based on their mode of
operation:
Local Version Control Systems
A basic and easy version management strategy that is very error-prone is maintaining several
versions of files by simply following a file naming convention or transferring files into
another directory. The first effective attempt to overcome this problem was a local version
control system. A local version control system keeps track of data on a single computer. The
patch sets (differences in the file's content at different stages) are saved in a particular format
on your local hard disk by this utility. By adding up all the appropriate fixes in sequence and
recreating the content to the user ("checking it out"), it may then replicate the file's contents
exactly at any point in time.

Figure 3.3.1a – Local Version Control Systems

Centralized Version Control Systems

11
Users began to believe that local version control systems hampered their activities since
people were unable to collaborate on the same project because the files and versions were
saved on one person's local computer and were not available to others working on the same
files. A solution to this problem was the creation of Centralized Version Control Systems
(CVCSs). CVCSs hold versioned files in a central location (server) that contributors may
access and check out to their local computers (clients). This has a lot of benefits, but the main
disadvantage is that the centralized server is the single point of failure (the risk of losing
everything if anything happens to the server).

Figure 3.3.1b – Centralized Version Control Systems

Distributed Version Control Systems

Version control systems that are distributed rather than centralized are known as distributed
version control systems (DVCSs). The clients clone the repository (a database of changes) in
its entirety, including its whole history. Any of the client repositories can be transferred to a
server if it dies, allowing the server to be restored. Every clone is regarded as a complete
backup of all data. These solutions enable you to work with many remote repositories where
local modifications may be pushed as needed, allowing you to collaborate with various
groups of people in different ways on the same project at the same time. Git, Mercurial, and
Bazaar are three popular DVCSs.

12
 Figure 3.3.1c – Distributed Version Control Systems

3.4 Working with Git

Git is a software program that allows you to monitor changes in any group of files. It's
typically used to coordinate work among programmers who are working on source code
together during software development. Speed, data integrity, and support for dispersed, non-
linear processes are among its objectives.
Today, Git is the most widely used version control system among software engineers. It was
the version control system that was to be utilized while working at Raoatech. Git may be used
from the command line or through a graphical user interface (as it comes with a lot of
commands for various actions). The next sections describe some version control processes
and principles, as well as the git commands that I used while working.

1. Cloning an existing repository

To clone a repository, you make a functioning duplicate of one that already exists. git
clone path/to/repository was used to do this. It's possible that the path is for a local
or remote repository. Learning to clone the project repositories to my PC was the first
process I had to learn before making any progress or getting to start working and
collaborating because I needed to clone projects I worked on during the course of my
internship program.

2. Creating a new git repository

13
 A repository (repo) is a database that holds files as well as the revision history for
each file. I used the git init command in the project's root directory to establish new
repositories.

3. Git Trees
A git project is made up of three "trees" that git keeps track of. The first is the
"working directory," which contains the files themselves. The index, which serves as
a staging area, comes next, followed by the repository, which links to the most recent
commit you've done.

Figure 3.6 – Git trees with commands used to move files from one tree to the other
4. Adding and committing changes
A file must first be uploaded to the staging area before it can be committed to a
repository. By performing the git add <filename> command, changes in the working
directory or files to be tracked were added to the staging area for the next commit.
This may be done for as many files as you like. Commits are used to keep track of
changes to files in a local repository. git commit -m "Descriptive commit message"
is used to make commits. Each commit should be assigned a unique ID and a
meaningful commit message for easy identification.

5. Viewing changes, commit logs, and status

The git diff command was used to inspect changes in the working directory that had
not yet been put to the index, and the git log command was used to view all commit
logs, which was useful if I needed to roll back changes to a specific commit. I used
the git status command to check my progress which indicates the current state of a
project, including which files have been modified, added or removed since the
previous commit. This was a command that I used frequently.

6. Pushing changes

14
 Your modifications are saved to the repository once you commit them. The git push
command was used to push those changes to a remote repository.

7. Branching
I utilized branches to create features that were separate from one another. When you
establish a repository, the master branch is the default branch. For development, I
used additional branches and then merged them back into the main branch after they
were finished. The command git checkout <branchname> was used to move to a
different branch.

8. Updating and merging

There was a requirement to update local repositories to reflect changes made by other
developers from remote repositories because each project had numerous individuals
working on it. This was accomplished by using the git pull command, which
automatically retrieved and merged updates. To manually integrate modifications, the
git merge command was used.

9. Resolving conflicts
In most cases, the version control system can integrate changes made by two separate
users at the same time. During an update or merge, a conflict occurs when two
separate users make simultaneous, different changes to the same line of a file. I have
to make manual adjustments in situations like this (decide which changes to preserve
and which to trash).

3.5 Front-end Web Development

Front-end web development is the process of using HTML, CSS, and JavaScript to create the
structure, design, behavior, animation and the functionality of a website's or web
application’s client-side. Users see and interact with the client-side of the web through the
browser.
Being focused and familiar with front-end web development and frontend technologies, I was
assigned to work as a frontend developer on an ongoing project (ANST Membership portal).

15
I was instructed during the first month to learn React (a JavaScript framework) and utilize it
to which was used in the development of the project.
Overall, I learned JavaScript, improved my HTML and CSS skills, worked with React-
Typescript and React-Redux, integrated various features on the projects involved with,
worked with APIs, actively contributed to the development of the Membership portal web
application.

3.6 Front-end Development Technologies

HTML, CSS, and JavaScript are the three primary web technologies used in front-end web
development. Also, I learnt and worked with React, which is a javascript library. Along the
line frameworks, packages were also used in the realization of the project

3.6.1 Languages used

Hypertext Markup Language (HTML)

HTML is a text-based standard for specifying how content on a web page is structured and
what each piece of content represents. With the use of tags, this markup instructs a web
browser on how to display text, pictures, and other types of multimedia on a webpage.

Cascading Style Sheets (CSS)

CSS is used to style web pages, while HTML offers the essential structure of a web page.
CSS is a style sheet language that describes how a document written in a markup language
like HTML is presented.

JavaScript (JS)
Javascript is a high-level programming language for making a web page more interactive. It
is used to make and manage dynamic web content.
After the HTML and CSS have been constructed and put together into a web page, the
JavaScript engine in the browser executes the JavaScript code. This guarantees that the page's
structure and style are already in place when JavaScript begins to execute.

These three languages are the fundamental languages that are utilized to build today's
websites. The table below demonstrates how each language contributes to the web page's
final content.

16
Language Code Snippet Web Output
s
HTML

HTML +
CSS

HTML + After button click

CSS + JS

Table 3.6.1 – Step by step combination of HTML, CSS, and JavaScript

17
3.6.2 Libraries used
In programming, a library is a collection of pre-compiled functions that a program can access.
Programming language libraries are similar to book libraries in their use. Existing libraries
consist of a collection of books, whereas programming language libraries consist of code. All
that is required when a book is needed is to go to a library and take the book that is required.
Similarly, in programming language libraries, you take the code you need for your
application, which is commonly referred to as modules and save it in object format. Libraries
are very handy for storing commonly used routines that can subsequently be simply included
in a program without the need to create that functionality.

A JavaScript library, as defined in the previous definition of a library, is a collection of pre-

written JavaScript that makes developing JavaScript-based applications easier. There are a
variety of JavaScript libraries available, and you can even write your own. jQuery, Prototype,
and React are some of the most popular JavaScript libraries. I used the React library out of all
of these.

React (also known as ReactJs) is a Facebook-maintained open-source JavaScript library that

is used to create user interfaces for single-page apps. It enables the creation of reusable user
interface components (which are essentially bespoke HTML elements with specific
functionality) that can then be combined to create complicated user interfaces
The most significant benefit of using custom HTML tags is that you can update any
component at any time without affecting the rest of the application. When new data is added
or updated, ReactJS quickly updates and renders only the components whose state has
changed to reflect the new information. This eliminates the need for the browser to reload the
entire program to reflect the changes.

18
 Fig 3.6.2a Snippet of a number of other libraries used.

3.6.3 Frameworks used

The dictionary definition of the framework as a “basic structure underlying a system” is not
far different from what a framework is in programming. Whether the system is a house, a car,
a theory, or a mobile app, the concept of the framework is the same: it provides the support
and essential ‘guide’ of the structure being built.
A framework in programming is a tool that provides ready-made components or solutions
that are customized to speed up development. A framework may include a library but is
defined by the principle of inversion of control (IoC). With traditional programming, the
custom code calls into the library to access reusable code. With IoC, the framework calls on
custom pieces of code when necessary.
In the context of this internship program and the project I worked on, Tailwind CSS was the
framework employed.
Tailwind CSS is a popular web development framework that makes it easier for designers and
developers to create stylish and responsive websites. It provides a set of pre-designed,
customizable building blocks (like buttons and cards) that can be easily combined to build a
website's layout and design. With Tailwind CSS, you don't need to write as much custom
CSS code, making web development more efficient and accessible for everyone.

19
 Fig 3.6.3a Lines of Code to style a button using HTML and CSS

Fig 3.6.3b Single line of code to achieve exact button styling using HTML and Tailwind CSS

3.7 JSX

JSX stands for JavaScript XML. It is simply a syntax extension of JavaScript. It allows us to
directly write HTML in React (within JavaScript code). It is easy to create a template using
JSX in React, but it is not a simple template language instead it comes with the full power of
JavaScript. It is faster than normal JavaScript as it performs optimizations while translating
to regular JavaScript. Instead of separating the markup and logic in separated files, React
uses components for this purpose.
When writing JSX, keep in mind that it must only return a single element. This element may
have any number of descendants, but there must be a single root element wrapping your
overall JSX (typically a <div> or a <span>).

Figure 3.7a – Valid JSX Syntax

20
See how there's only one <div> element in the code above and that all other JSX is nested
inside it? This is how you have to write it if you want multiple elements. To be completely
clear, the following is incorrect and will cause an error:

Figure 3.7b Invalid JSX Syntax

In this example, we have two sibling elements that are both at the root level (i.e. <h1> and
<ul>). This won't work and will give the error:

3.7.1 Characteristics of JSX:

1. JSX is not mandatory to use there are other ways to achieve the same thing but
using JSX makes it easier to develop react applications.
2. JSX allows writing expression in { }. The expression can be any JS expression or
React variable.
3. To insert a large block of HTML we have to write it in a parenthesis i.e, ().
4. JSX produces react elements.
5. JSX follows XML rule.
6. After compilation, JSX expressions become regular JavaScript function calls.
7. JSX uses camelcase notation for naming HTML attributes. For example, tabindex in
HTML is used as tabIndex in JSX.

3.7.2 Advantages of JSX:

1. JSX makes it easier to write or add HTML in React.

2. JSX can easily convert HTML tags to react elements.

21
 3. It is faster than regular JavaScript.
4. JSX allows us to put HTML elements in DOM without
using appendChild() or createElement() method.
5. As JSX is an expression, we can use it inside of if statements and for loops, assign it
to variables, accept it as arguments, or return it from functions.
6. JSX prevents XSS (cross-site-scripting) attacks popularly known as injection
attacks.
7. It is type-safe, and most of the errors can be found at compilation time.

3.7.3 Disadvantages of JSX:

1. JSX throws an error if the HTML is not correct.

2. In JSX HTML code must be wrapped in one top-level element otherwise it will give
an error.
3. If HTML elements are not properly closed JSX will give an error.

3.8 Working with APIs

An Application Programming Interface (API) is a software interface that connects two

applications. It is a set of precisely defined communication mechanisms and routines among
distinct software components. A good API simplifies the development of computer software
by giving all of the necessary building components, which the programmer then assembles.
The Google Maps API, for example, is used to embed Google Maps in webpages.

To make HTTP (hypertext transfer protocol) requests to these endpoints, I used the node-
fetch package. To make asynchronous requests, fetch uses promises and requires an
understanding of JavaScript promises (requests that the browser does not have to wait for).

22
 Figure 3.8 – Making a POST request to an API endpoint using axios

3.9 Code Refactoring

Code Refactoring had been a critical part of the development process. The process of
clarifying and simplifying the design of existing code without changing its behavior is known
as code refactoring. As time passed and I gained more knowledge and was able to find less
difficult and more efficient solutions for some of the solutions that had already been
implemented. This necessitated making changes to existing code while ensuring that no
functionality was harmed.
The images below will show blocks of code which perform exactly the same actions, of
which the later was refactored to reduce code repetition and performance.

Fig 3.9a Base code

23
Fig 3.9b Refactored code that resolves repetition, improves performance, reduces number of
lines while performing the exact same functionality as its counterpart in fig 3.9a above

3.10 ANST Membership Portal

During my industrial training at Raoatech, I was assigned this membership portal project,
from inception to the completion of the project. A brief overview of the scope and features of
the application will be explained in the following sections

3.10.1 Brief Overview of the ANST Membership portal

The ANST membership portal is a web application, built using React, a javascript library
explain in previous section above, Tailwind CSS and a couple of other libraries. The
application was designed and developed to manage and facilitate the membership and affairs
of the association of nigerian software testers.

3.10.2 Scope/Features of the application

The following spells out the complete scope, features and complete experience the
application comes with

24
1. Landing page

Fig 3.10.2a ANST landing page

2. User onboarding/KYC:
a. Signup: Like every other application, the application includes a signup page to
get new users signed up and onboarded on the application

Fig 3.10.2a ANST Signup/KYC page

b. Login: To get existing user back to where they left off.

25
 Fig 3.10.2b ANST Login page

c. Verification: On signup, users are required to follow a link set to their

registered email. This is a regular verification and authentication process.

Fig 3.10.2c ANST Verification Page

d. Dashboard: User dashboard to give a summarized analytics and report.

26
 Fig 3.10.2d ANST Dashboard Page

e. Edit Profile: A page where users are allowed to edit some information provided during
the onboarding process such as name, address, years of experience, etc.

Fig 3.10.2e ANST Edit Profile page

f. Discussion: A real-time chat feature that allows users to join groups and seamlessly
communicate with other existing users in the application.

27
 Fig 3.10.2f ANST Discussion page

g. Event Calendar: Displays a list of scheduled and upcoming events with other details.

Fig 3.10.2g ANST Events Calendar page

h. Resource library: Allows users to share files (upload and download) on the application

28
 Fig 3.10.2h ANST Resources Library Page

i. Certificate: Displays and provides a certificate of membership to registered users who

have paid the certificate bill.

Fig 3.10.2i ANST Certificate Page

j. Voting: In-app polls and voting

29
 Fig 3.10.2j ANST Voting Page

k. Bills: Displays a list of paid and outstanding payments assigned to each user.

Fig 3.10.2k ANST Bills Page

30
l. Members Profile: A table displaying the list of all verified users onboarded on the
application.

Fig 3.10.2l ANST Admin Member Profile page

3.10.2 Application Roles

Before diving deeper into my contributions to the realization of the project, it is more than
necessary to mention that application hinged on user role. There are two distinct roles for this
application:
1. Admin
2. User: Further broken down in to 3 groups, graduate, student, cooperate.

3.11 My Contributions

In this section, I will be giving detailed explanations as regards my contributions to the

completion of the Membership portal application during the course of my internship program,
which are:
1. Bills
2. Discussion
3. Resource library

31
 4. Members Profile

3.11.1 Bills

The bills feature is solely for the creation, assignment, overview and payment of bills/fees
within the association. Like almost every feature designed and developed in this application,
the bills feature is separately designed according to the user role. The table below explains
the functionalities associated with each role as regards this feature.

ADMIN USER
Bill creation and assignment to user groups View list of pending and paid bills assigned
by admin
View payment report of all bills created, Payment of bills assigned
assigned with payment status

3.11.2 Discussion

The discussion feature integrates a real time chat/messaging feature within the application.
Using a bilateral communication technology called sockets (socket.io) I was able to
implement this discussion feature. Also like every other feature in this application, the user
role played a part in the access, restriction and functionality that each user type could access
and perform with this feature. This discussion feature only enables the admin to create
groups, only through which users can join, chat and communicate.

32
 ADMIN USER
Create discussion groups Can only view list of groups available
Join available groups and send messages Join available groups and send messages

3.11.3 Resource Library

This module aimed at facilitating sharing of files within the application. For this feature also
the user role played a part in the access, restriction and functionality that each user type could
access and perform with this feature.

ADMIN USER
Upload and download files Download files only

33
3.11.4 Members Profile

JSX The members profile is a feature only available to the admin role, this feature gives
information and insight to the admin regarding all verified users registered on the application.
This feature is simply a table designed that displays all of the information.

3.11.5 Other Notable Contributions

Asides the pages/features that I was assigned to during the course of my internship program
which I have provided details about in the sections above, there are a number of contributions
I made personally which I believe are worth mentioning as they made a significant impact
towards the progress and success of the application, which include:
1. Search Bar and Search Functionality: More than 50% of features in the application
(bills, members profile, resource library, etc.) involved and employed a search bar
and search functionality that enables our users to search data. I implemented a
reusable search bar component and functionality that was used across all the
necessary features in the application including features that were not implemented by
me, saving my team members the time and hassle of writing the search bar code from
scratch.
2. Remember Me Functionality: Although the login page was not one of the features
assigned to during my internship, I was assigned to brainstorm and implement a
remember-me mechanism for the login page which allows users login credentials to
be saved and relieve them the hassle of retyping their email and passwords each time
they log out.
3. Reusable Table Component: Just like the search bar, a considerable percentage of
the applications features required tables to render data, so I implemented a custom
table which could be reused when and where required without the hassle of rewriting
the whole table block of code from scratch.
4. Environment variables (env): At the beginning of the project, for every api request,
I and all my team members had to type the projects baseurl
“https://staging.api.anstesters.com/api” manually followed by the specific endpoint to
be called. This was quite inconvenient and unnecessary repetition, I made findings
and research and came up with the solution of implementing the .env file where
variables that seems to be sensitive and severally repeated. Now implementing this

34
 with axios create resolved the problem of having to always manually type the projects
baseurl when making requests to enpoints.

env file setting the baseurl as REACT_APP_API_URL

Setting up the axiosInstance using the baseURL from the .env file

Making a request without having to manually repeat the baseURL

35
3.15 Web Applications Created

Number Puzzle6t
I created a number sliding puzzle game that looks just like the handcrafted version. The React
JavaScript framework was used to create this project, which was hosted on Netlify and has
had a lot of public engagement.

3.16 Development tools

1. Visual Studio Code

Visual Studio Code is a source code editor that can be used to write, test, and build apps. It's
a desktop-based source code editor that's both light and powerful. It contains built-in support
for JavaScript, TypeScript, and Node.js, as well as a large ecosystem of extensions for
additional languages and runtimes (such as C++, C#, Java, Python, PHP, and Go) (such
as .NET and Unity). Auto-completion, syntax checking, debugging, embedded Git control,
syntax highlighting, intelligent code completion, snippets, and code refactoring are all
supported. It includes a robust ecosystem of plugins for supporting additional languages, and
it's a cross-platform program that can run on any operating system.

2. Jira

At Raoatech, the project management system Jira was utilized to track progress between
activities completed by different persons. It's a project management application that divides
projects into boards. jira displays what's being worked on, who's working on it, and where
something is in the process at a glance.

3.17 Soft Skills

My professional experience included more than just learning technical abilities. Working at
Raoatech IT-Electromech also necessitated the development of soft skills. Specifically, I was
assigned to three client schools of the company where carried out weekly STEM training
sessions on coding and robotics for beginners. This facilitated and encouraged me in
improving my people and public speaking skills.

36
Soft skills are a combination of people skills, social skills, communication skills, character or
personality traits, attitudes, career attributes, social intelligence, and emotional intelligence
quotients, among others, that enable people to navigate their environment, work well with
others, perform well, and achieve their goals with complementing technical skills, according
to Wikipedia.

Photo of me assisting in a presentation during one of the office meetings

37
Photo of me at a company clients school on one of the coding sessions

CHAPTER FOUR: DISCUSSION, ANALYSIS,

CONCLUSION AND RECOMMENDATION

4.1 Discussion

My participation in this program provided me with a diverse set of abilities (both technical
and non-technical) as well as exposure to key concepts in my area of expertise. In addition, I
was able to apply what I learned at my university to real-world circumstances at work.
Overall, I learned how to work in a command-line terminal. I learned how to utilize git
version control to manage all of the team's projects. I used a variety of languages, libraries,

38
and tools, the majority of which I had to learn on the job. Because most of my work required
the usage of classes and objects, I became familiar with object-oriented programming.
Working in a group taught me about planning and organization.

Each role introduced me to different aspects of the software development process, such as:

1. software specification, which involved putting together requirements for apps and
services.
2. Developing apps was a part of the software development and implementation
process, as well as the implementation of various features.
3. I performed software validation to ensure that implemented features were functioning
properly.
4. Software evolution which entails making more modifications over time as
requirements evolved.

4.2 Skills acquired during training

Among the skills I learned during my 6-month internship at Raoatech IT-Electromech are the

following:

1. Frontend development using the ReactJs Framework

2. JavaScript latest versions ES6/ES7
3. API integrations
4. Styling with CSS preprocessor such as the SASS Library
5. CSS frameworks with TailwindCSS
6. Version control using Git
7. State management using the Redux Library
8. Team collaboration using Jira

I also developed interpersonal skills, including teamwork, communication, and

leadership. Aside from the remarkable technical abilities I acquired, I gained a better
understanding of the professional setting and how business processes operate.

4.3 Relevance to academic discipline

39
At Raoatech, I worked as a Software Engineer. As a result, the employment was directly
related to my field of study, as Computer Software Engineering it is one of the primary
specialties in Computer Engineering.

4.4 Relevant Courses

Some of the courses I took in the department of computer engineering at the University of
Lagos before SIWES (200L - 400L) that are relevant to my industrial work experience are
listed below:

1. CPE 221 (Computer Programming I)

2. CPE 311 (Computer Programming Language II)
3. CPE 415 (Computer Programming Languages)
4. GEG 411 (Technical Communications)

The following are some of the courses I will be taking in my fifth year that are closely
relevant to my work experience:

1. CPE 513 (Machine Language Programming)

2. CPE 535 (Software Engineering)
3. CPE 536 (Systems Programming I)

This demonstrates how the training helped to bridge the gap between theory and practice.

4.5 Challenges encountered

Among the challenges I encountered were the following:

1. Firstly, it was a challenge getting accustomed to working life and absorbing the
company’s principles and activities.
2. Learning, understanding and familiarizing myself with new technologies whilst
having to actively deliver and contribute to the project I was assigned by the company
was very demanding and challenging.
3. My laptop developed fault, as the battery and keyboard both damaged early into my
internship program, causing unexpected expenses in acquiring a new system so as to
keep up.

40
 4. I actively and consciously had to learn acute time management to be able to turn over
deliverables as at when due.
5. Public speaking has always been one of my shortcomings, working as a student tutor
taking coding sessions was quite inconvenient and challenging for me at the
beginning.
6. As inevitable has collaboration is, it was also a challenge whenever conflicts arise in
the projects codebase which must be resolved.

4.6 Conclusion

The Students Industrial Work Experience Scheme is an amazing way for students to get
involved in activities outside of the classroom while also applying what they've learned in
class. It also encourages students to obtain hands-on experience in the industry, as well as
learn more about in-demand skills.

One of the most essential benefits of the program is the hands-on work experience I acquired,
which I could not have obtained in a classroom context. Working on real-life projects during
my six-month internship at Raoatech helped me better appreciate these academic principles.
Without a doubt, this program was eye-opening, and it has aided me in gaining the practical
knowledge required for my field of study. It also taught me about the importance of work
ethics and discipline, both of which are embodied in SIWES.

Exploration is a crucial part of the university experience, and internships are a terrific way for
students to get a taste of the field they want to pursue. Some students enter college with a
specific professional route in mind and then change their views. Taking up an internship
while in college allows students to get experience in their chosen industry while also allowing
them to determine if it is the appropriate fit for them.

Finally, I'd want to emphasize the significance of the Students Industrial Work Experience
Scheme in bridging the gap between the academic institution and the industry. During my
internship, I learned a lot about my skills and shortcomings. I was able to receive feedback
from supervisors and other experts in the industry, which provided a unique learning
experience that I would not have had as a full-time employee.

41
4.5 Recommendation

1. Foremost, I believe the SIWES/ITF body should consider increasing the program
duration from the ongoing 6 months to minimum of 12 months as this would provide
every graduating student a base of 1-year work experience that will significantly
improve job and life opportunities after graduation
2. Alternatively, the body could explore the possibility of students undergoing the
internship program more frequently, maybe at the end of each academic session,
because SIWES contributes to their practical experience in relation to their subject of
study.
3. Obtaining internship positions at well-known organizations continues to be a major
challenge for aspiring interns. Universities, in my opinion, should aid students in
obtaining relevant industrial placements.
4. A significant percentage of students have to step out of their states and cities of
residence in search of internship placement, therefore I believe the SIWES body
should implore and encourage companies to offer remunerations to student interns to
help cushion financial challenges that most definitely will arise during the program.
5. The institutions and companies should actively collaborate in monitoring and tracking
interns’ activities and progress.
6. Interns should seek to gain as much experience as possible, thus their industry
supervisor should guarantee that they are appropriately engaged.

4.5 Reference

1. Mafe, O. A. T. (2014). Guide to Successful Participation in SIWES, Gbemi Sodipo

Press Limited, Abeokuta.
2. Ralph N. Agwuna, “Detailed manual on SIWES Guidelines and Operations for
Tertiary Institutions”, 2012, pp. 3-6.
3. Mcfidel Onyemauwa, “Siwes Basics”, January 18, 2019.[Online] Available:
https://siwesbeginner.com/siwes-introduction/.
4. The University of Lagos, Faculty of Engineering Prospectus.

42
5. Version Control Systems, Git and Github: https://medium.com/version-control-
system/types-of-version-control-system-766a6b656088
6. React - Wikipedia: https://en.wikipedia.org/wiki/React_(JavaScript_library)
7. ECMAScript - Wikipedia: https://en.wikipedia.org/wiki/ECMAScript

43