INTERNSHIP REPORT 2021-2022

CHAPTER 1

COMPANY PROFILE

Name Bitspark Technology

Address 62/1 19TH CROSS RAMANUJA ROAD Mysuru,
Karnataka, 570004 India
Contact Number +91-944951842
Email [email protected]
Website https://bitsparktecnology.live
Company Registration Number U72900KA2021PTC144984
Type of the Company Private
Nature of the Company Information Technology
Company Logo

Vision BitSpark Technology company is developing web

applications for the custom business requirements of
all our esteemed clients. Our developer’s skills &
experience will deliver you with powerful Web
Applications.
Company Operational Status Private

Dept. of CSE, C.E.C Page 1

INTERNSHIP REPORT 2021-2022
CHAPTER 2

ABOUT THE COMPANY

Bitspark Technology Private Limited is a private company founded in 2021. It is
classified as a private limited company and is located in Mysore, Karnataka. It is involved
in other computer related activities [for example maintenance of websites of other firms/
creation of multimedia presentations for other firms etc.]

2.1 History
Bitspark Technology Private Limited is a training platform for computer related activities
[for example maintenance of websites of other firms/ creation of multimedia
presentations for other firms etc.] Bitspark Technology Private Limited is a private
company founded in 2021. Bitspark Technology Private Limited in Mysore, Karnataka,
IN 570004]. Bitspark Technology Private Limited has an estimated 28 employees. From
its humble beginnings, Bitspark Technology Private Limited offers modern solutions for
growing business. At Bitspark Technology Private Limited, they ensure training is
imparted by specialists with proven subject matter expertise and who have spent over a
decade in their area of specialization. Besides training, they also provide placement
assistance to the trainee. BitSpark Technology company is developing web applications
for the custom business requirements of all our esteemed clients. Our developer’s skills &
experience will deliver you with powerful Web Applications.
We also provide the internship for various students as well as short term training in latest
trends in development and IT related.

2.2 Achievements in Business

Bitspark Technology Private Limited is where talent meets opportunity and they believe
trainee who comes over here in search for his dream job or the dream professional ends
here. Bitspark Technology Private Limited in order to provide the job opportunity and
make a student into professional IT candidate. Currently it has its branches in Mysore
(#62/1, 19th cross, Ramanuja Road, Mysore - 570004, Karnataka, India).

BitSpark Technology is an expert Web Application Development Company which offers

amazing web applications to its clients. Our Vision is to provide value added high quality
IT solutions.
Dept. of CSE, C.E.C Page 2
INTERNSHIP REPORT 2021-2022
With the help of our highly qualified, skilled & experienced developers we serve highly
customized web applications to our clients.

The major milestones achieved by Bitspark Technology Private Limited are as follows:
 Till now trained 1500 developers on Web.
 Training 500 engineers every year.
 Up skill 500 web developers every year.

2.3 Overall turnover

Bitspark Technology Private Limited is a training platform for web developers that offers
various courses for individuals and educational institutions. Bitspark Technology Private
Limited headquarters is located in Mysore, Karnataka. Bitspark Technology Private
Limited generates ₹10,000 in revenue per employee.

2.4 Number of Employees

At present there are 28 employees working in Bitspark Technology Private Limited.
Faculty are highly competent, skilled and dedicated to giving their best towards the
professional development of students and building competency into over 42 students a
month.
Bitspark Technology Private Limited have incubation center in India. This
incubation center prepare students in the final semester of their graduate studies, so that
they are deployable as soon as they graduate.
Professional development happens when professionals improve their skills which
will enhance their performance and means of achieving it would be from corporate
training. They have experience in providing on-site and offshore corporate training
programs and have successfully delivered many corporate training programs so far. They
work with many organizations to provide corporate training in courses which includes
Development. After the training, if the engineers start implementing the topics learnt
during training, they provide free guidance to identify the gaps and fine tune the
understanding for half day (if required). The trainers have more than 6 years of
experience in the area of Web Development.

2.5 About the Department

Bitspark Technology Private Limited Web Development training organization
with an aim to bridge the gap between the demands of the industry and the curriculum of

Dept. of CSE, C.E.C Page 3

INTERNSHIP REPORT 2021-2022
educational institutions. With centre in India, the institute is a platform where young
minds are given the opportunity to build successful careers. Bitspark Technology Private
Limited is a place where will deliver you with powerful Web Applications.

Web development refers to the building, creating, and maintaining of websites. It

includes aspects such as web design, web publishing, web programming, and database
management. It is the creation of an application that works over the internet i.e. websites..
The word Web Development is made up of two words, that is:
 Web: It refers to websites, web pages or anything that works over the
internet.
 Development: Building the application from scratch.

2.6 Nature of Products

Designing a great web applications, one that provides a good user experience and
converts well, involves professional skills. It takes time. It includes experience from our
team and your valuable input.
Web Applications have evolved into sophisticated computing tools that not only
provide standalone function to the end user, but also have been integrated with corporate

databases and business applications.

2.7 Nature of Customers

A product is an item that can be sold to customers and it is common for companies
to call everything they produce and sell products. A service on the other hand is a
valuable action, deed, or effort performed to satisfy a need or to fulfil a demand.
Web applications are popular because they play a crucial role in the branding
process.
Using this technology, a business is able to maintain a proper communication channel
between potential customers and other business organisations.

2.8 Introduction to the department where work is carried out

 Web Development
 C, C++ Programming
 General Aptitude

Dept. of CSE, C.E.C Page 4

INTERNSHIP REPORT 2021-2022

 Spoken English

CHAPTER 3

TASK PERFORMED
All the tasks performed during the internship program were based on Front End Web
Development. The trainer had assigned a few tasks which would prove to be
quintessential for industry standards and understanding the technology easily.

3.1 HTML

HTML (HyperText Markup Language) is the most basic building block of the Web. It
defines the meaning and structure of web content. Other technologies besides HTML are
generally used to describe a web page's appearance/presentation or functionality/
behavior.

"Hypertext" refers to links that connect web pages to one another, either within a single
website or between websites. Links are a fundamental aspect of the Web. By uploading
content to the Internet and linking it to pages created by other people, you become an
active participant in the World Wide Web.

Fig 3.1: A simple html document

Dept. of CSE, C.E.C Page 5

INTERNSHIP REPORT 2021-2022
Html document explaination The declaration defines that this document is an HTML5
document The element is the root element of an HTML page

The <head> element contains meta information about the HTML page
The <title> element specifies a title for the HTML page (which is shown in the browser's
title bar or in the page's tab)
The <body> element defines the document's body, and is a container for all the visible
contents, such as headings, paragraphs, images, hyperlinks, tables, lists, etc.
The <h1> element defines a large heading
The <p> element defines a paragraph

3.1.1 HTML Page Structure

Below is a visualization of an HTML page structure:

Fig. 3.2: Visualization of HTML page structure

3.1.2 HTML Element

An HTML element is defined by a start tag, some content, and an end tag.
The HTML element is everything from the start tag to the end tag:
<tagname> Content </tagname>
Example:

Dept. of CSE, C.E.C Page 6

INTERNSHIP REPORT 2021-2022
<h1>My First Heading</h1>
<p>My first paragraph.</p>

3.1.3 HTML Formatting Element

Formatting elements were designed to display special types of text:

 <b> - Bold text

 <strong> - Important text
 <i> - Italic text
 <em> - Emphasized text
 <mark> - Marked text
 <small> - Smaller text
 <del> - Deleted text
 <ins> - Inserted text
 <sub> - Subscript text
 <sup> - Superscript text

3.1.4 HTML CSS

Cascading Style Sheets (CSS) is used to format the layout of a webpage. With
CSS, you can control the color, font, the size of text, the spacing between elements, how
elements are positioned and laid out, what background images or background colors are
to be used, different displays for different devices and screen sizes, and much more.
CSS can be added to HTML documents in 3 ways:
 Inline - by using the style attribute inside HTML elements
 Internal - by using a <style> element in the <head> section
 External - by using a <link> element to link to an external CSS file

INLINE CSS
An inline CSS is used to apply a unique style to a single HTML element.
An inline CSS uses the style attribute of an HTML element.
The following example sets the text color of the <h1> element to blue, and the text color
of the <p> element to red:

<h1 style="color:blue;">A Blue Heading</h1>

Dept. of CSE, C.E.C Page 7

INTERNSHIP REPORT 2021-2022
<p style="color:red;">A red paragraph.</p>

INTERNAL CSS
An internal CSS is used to define a style for a single HTML page.
An internal CSS is defined in the <head> section of an HTML page, within
a <style> element.
The following example sets the text color of ALL the <h1> elements (on that page) to
blue, and the text color of ALL the <p> elements to red. In addition, the page will be
displayed with a "powderblue" background color:
<!DOCTYPE html>
<html>
<head>
<style>
body {background-color: powderblue;}
h1 {color: blue;}
p {color: red;}
</style>
</head>
<body>

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

</body>
</html>

EXTERNAL CSS
An external style sheet is used to define the style for many HTML pages.
To use an external style sheet, add a link to it in the <head> section of each HTML page:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="styles.css">
</head>

Dept. of CSE, C.E.C Page 8

INTERNSHIP REPORT 2021-2022
<body>

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

</body>
</html>

OUTPUT:

This is a Heading

This is a Paragraph

3.2 CSS
Cascading Style Sheets (CSS) is a stylesheet language used to describe the presentation of
a document written in HTML or XML (including XML dialects such as SVG, MathML
or XHTML). CSS describes how elements should be rendered on screen, on paper, in
speech, or on other media.

CSS is among the core languages of the open web and is standardized across Web
browsers according to W3C specifications. Previously, development of various parts of
CSS specification was done synchronously, which allowed versioning of the latest
recommendations.

3.2.1 CSS syntax

CSS is a rule-based language — you define the rules by specifying groups of styles that
should be applied to particular elements or groups of elements on your web page. For
example, you can decide to have the main heading on your page to be shown as large red
text. The following code shows a very simple CSS rule that would achieve the styling
described above:
h1 {
color: red;
font-size: 5em;

Dept. of CSE, C.E.C Page 9

INTERNSHIP REPORT 2021-2022
}
In the above example, the CSS rule opens with a selector . This selects the HTML
element that we are going to style. In this case, we are styling level one headings (<h1>).
We then have a set of curly braces { }. Inside the braces will be one or more declarations,
which take the form of property and value pairs. We specify the property (color in the
above example) before the colon, and we specify the value of the property after the colon
(red in this example). This example contains two declarations, one for color and the other
for font-size. Each pair specifies a property of the element(s) we are selecting (<h1> in
this case), then a value that we'd like to give the property.

3.2.2 CSS selectors

In CSS, selectors are used to target the HTML elements on our web pages that we want to
style. There are a wide variety of CSS selectors available, allowing for fine-grained
precision when selecting elements to style.

3.2.3 CSS layout

CSS page layout techniques allow us to take elements contained in a web page and
control where they're positioned relative to the following factors. their default position in
normal layout flow, the other elements around them, their parent container, and the main
viewport/window. The page layout techniques are:
 Normal flow
 The display property
 Flexbox
 Grid
 Floats
 Positioning
 Table layout
 Multiple-column layout

Each technique has its uses, advantages, and disadvantages. No technique is designed to
be used in isolation. By understanding what each layout method is designed for you'll be
in a good position to understand which method is most appropriate for each task.

3.2.4 CSS Positioning

Dept. of CSE, C.E.C Page 10
INTERNSHIP REPORT 2021-2022
Positioning allows you to take elements out of normal document flow and make them
behave differently, for example, by sitting on top of one another or by always remaining
in the same place inside the browser viewport.

Types of Positioning
 Static Positioning
 Sticky Positioning
 Absolute and relative

Example to show the basic working of CSS code.

<!DOCTYPE html>
<html>
<head>
<style>
p{
color: red;
text-align: center;
}
</style>
</head>
<body>

<p>Hello World!</p>
<p>These paragraphs are styled with CSS.</p>

</body>
</html>

OUTPUT:

Hello World!

These paragraphs are styled with CSS.

Dept. of CSE, C.E.C Page 11

INTERNSHIP REPORT 2021-2022

3.3 JAVASCRIPT
JavaScript (JS) is a lightweight, interpreted, or just-in-time compiled programming
language with first-class functions. While it is most well-known as the scripting language
for Web pages, many non-browser environments also use it, such as Node.js, Apache
CouchDB and Adobe Acrobat. JavaScript is a prototype-based, multi-paradigm,
singlethreaded, dynamic language, supporting object-oriented, imperative, and declarative
(e.g. functional programming) styles

3.3.1 Control flow

JavaScript supports a compact set of statements, specifically control flow statements, that
you can use to incorporate a great deal of interactivity in your application.
A conditional statement is a set of commands that executes if a specified condition is true.
JavaScript supports two conditional statements: if...else and switch.

if (condition) {
statement_1;
} else {
statement_2;
}

3.3.2 Exception handling statements

You can throw exceptions using the throw statement and handle them using the try...catch
statements.
The try...catch statement marks a block of statements to try, and specifies one or more
responses should an exception be thrown. If an exception is thrown, the try...catch
statement catches it.
The try...catch statement consists of a try block, which contains one or more statements,
and a catch block, containing statements that specify what to do if an exception is thrown
in the try block.

Example:
function getMonthName(mo) {
mo = mo - 1; // Adjust month number for array index (1 = Jan, 12 = Dec)

Dept. of CSE, C.E.C Page 12

INTERNSHIP REPORT 2021-2022
let months = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul',
'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
if (months[mo]) {
return months[mo];
} else {
throw 'InvalidMonthNo'; // throw keyword is used here
}
}
try { // statements to try
monthName = getMonthName(myMonth); // function could throw exception
}
catch (e) {
monthName = 'unknown';
logMyErrors(e); // pass exception object to error handler (i.e. your own function)
}

3.3.3 Functions
Functions are one of the fundamental building blocks in JavaScript. A function in
JavaScript is similar to a procedure—a set of statements that performs a task or calculates
a value, but for a procedure to qualify as a function, it should take some input and return
an output where there is some obvious relationship between the input and the output. To
use a function, you must define it somewhere in the scope from which you wish to call it.

A JavaScript function is defined with the function keyword, followed by a name,

followed by parentheses (). Function names can contain letters, digits, underscores, and
dollar signs (same rules as variables).
The parentheses may include parameter names separated by commas:
(parameter1, parameter2, ...). The code to be executed, by the function, is placed inside
curly brackets: {}

Example to change HTML element using JS code.

<!DOCTYPE html>
<html>
<body>

Dept. of CSE, C.E.C Page 13

INTERNSHIP REPORT 2021-2022

<h2>What Can JavaScript Do?</h2>

<p id="demo">JavaScript can change HTML content.</p>

<button type="button" onclick='document.getElementById("demo").innerHTML =

"Hello JavaScript!"'>Click Me!</button>

</body>
</html>

OUTPUT:

3.4 PHP
PHP is a widely used server-side programming language that’s become increasingly fast
and powerful over the years. PHP works well with HTML and databases, making it a
great language for anyone interested in building dynamic web applications.

The PHP contains the following features:

o Performance.
o Open Source.
o Familiarity with Syntax.
o Embedded.

Dept. of CSE, C.E.C Page 14

INTERNSHIP REPORT 2021-2022
o Platform Independent.
o Database Support.
o Error Reporting.
o Loosely Typed Language.
o Web servers Support.
o Security
o Control
o A Helpful PHP Community

Performance:
PHP script is executed much faster than those scripts which are written in other languages
such as JSP and ASP. PHP uses its own memory, so the server workload and loading time
is automatically reduced, which results in faster processing speed and better performance.
Open Source:
PHP source code and software are freely available on the web. You can develop all the
versions of PHP according to your requirement without paying any cost. All its
components are free to download and use.
Familiarity with syntax:
PHP has easily understandable syntax. Programmers are comfortable coding with it.
Embedded:
PHP code can be easily embedded within HTML tags and script.
Platform Independent:
PHP is available for WINDOWS, MAC, LINUX & UNIX operating system. A PHP
application developed in one OS can be easily executed in other OS also.
Database Support:
PHP supports all the leading databases such as MySQL, SQLite, ODBC, etc.
Error Reporting -
PHP has predefined error reporting constants to generate an error notice or warning at
runtime. E.g., E_ERROR, E_WARNING, E_STRICT, E_PARSE.
Loosely Typed Language:
PHP allows us to use a variable without declaring its data type. It will be taken
automatically at the time of execution based on the type of data it contains on its value.
Web servers Support:
PHP is compatible with almost all local servers used today like Apache, Netscape,
Microsoft IIS, etc.

Dept. of CSE, C.E.C Page 15

INTERNSHIP REPORT 2021-2022
Security:
PHP is a secure language to develop the website. It consists of multiple layers of security
to prevent threads and malicious attacks.
Control:
Different programming languages require long script or code, whereas PHP can do the
same work in a few lines of code. It has maximum control over the websites like you can
make changes easily whenever you want.
A Helpful PHP Community:
It has a large community of developers who regularly updates documentation, tutorials,
online help, and FAQs. Learning PHP from the communities is one of the significant
benefits.

Example for Basic Syntax of PHP.

<!DOCTYPE html>
<html>
<body>

<h1>My first PHP page</h1>

<?php
echo "Hello World!";
?>

</body>
</html>

OUTPUT:

My first PHP page

Hello World!

3.5 Ruby on Rails

Dept. of CSE, C.E.C Page 16

INTERNSHIP REPORT 2021-2022
Ruby on Rails or also known as rails is a server-side web application development
framework that is written in the Ruby programming language, and it is developed by
David Heinemeier Hansson under the MIT License. It supports MVC(model-view-
controller) architecture that provides a default structure for database, web pages, and web
services, it also uses web standards like JSON or XML for transfer data and HTML, CSS,
and JavaScript for the user interface. It emphasizes the use of other well-known software
engineering pattern and paradigms like:

Don’t Repeat Yourself (DRY): It is a principle of software development to reducing the

repetition of information or codes.
Convention Over Configuration (CoC): It provides many opinions for the best way to do
many things in a web application.

Example:

# The Hello Class

class Hello

def initialize( name )

@name = name.capitalize
end

def salute
puts "Hello #{@name}!"
end

end

# Create a new object

h = Hello.new("Ruby")

# Output "Hello Ruby!"

h.salute

OUTPUT:

Dept. of CSE, C.E.C Page 17

INTERNSHIP REPORT 2021-2022
Hello Ruby!

Rails:
 An extremely productive web-application framework.
 Written in Ruby by David Heinemeier Hansson.
 You could develop a web application at least ten times faster with Rails than you
could with a typical Java framework.
 An open source Ruby framework for developing database-backed web
applications.
 Configure your code with Database Schema.
 No compilation phase required.
Rails Strengths
Rails is packed with features that make you more productive, with many of the following
features building on one other.
Metaprogramming
Where other frameworks use extensive code generation from scratch, Rail framework
uses Metaprogramming techniques to write programs. Ruby is one of the best languages
for Metaprogramming, and Rails uses this capability well. Rails also uses code generation
but relies much more on Metaprogramming for the heavy lifting.
Active Record
Rails introduces the Active Record framework, which saves objects into the database. The
Rails version of the Active Record discovers the columns in a database schema and
automatically attaches them to your domain objects using metaprogramming.
Convention over configuration
Most web development frameworks for .NET or Java force you to write pages of
configuration code. If you follow the suggested naming conventions, Rails doesn't need
much configuration.
Scaffolding
You often create temporary code in the early stages of development to help get an
application up quickly and see how major components work together. Rails automatically
creates much of the scaffolding you'll need.
Built-in testing
Rails creates simple automated tests you can then extend. Rails also provides supporting
code called harnesses and fixtures that make test cases easier to write and run. Ruby can
then execute all your automated tests with the rake utility.
Three environments
Rails gives you three default environments: development, testing, and production. Each
behaves slightly differently, making your entire software development cycle easier. For
example, Rails creates a fresh copy of the Test database for each test run.

Dept. of CSE, C.E.C Page 18

INTERNSHIP REPORT 2021-2022

3.6 Assignment-1
Simple Calculator:

“Simple Calculator” is an app that will make us learn more depth about HTML, CSS and
basics of JS and we implement all these together to make a beautiful responsive
calculator.

Fig 3.3. Starting page of the Application

Fig 3.4. Basic Functionality of Application

Dept. of CSE, C.E.C Page 19

INTERNSHIP REPORT 2021-2022

3.7 Assignment-2
PHP Form:

Fig 3.5. Starting page of the Application

Fig 3.6. User Input Data into the form

Dept. of CSE, C.E.C Page 20

INTERNSHIP REPORT 2021-2022

Fig 3.7. User press Submit Button

Fig 3.8. User Input Data into the form

Dept. of CSE, C.E.C Page 21

INTERNSHIP REPORT 2021-2022
3.8 PROJECT
Stock Market App Using Ruby on Rails

Fig: 3.9 Home page

Fig: 3.10 Signup Page

Dept. of CSE, C.E.C Page 22

INTERNSHIP REPORT 2021-2022

Fig: 3.11 Signup success and logged in page

Fig: 3.12 Stock Market Table

Dept. of CSE, C.E.C Page 23

INTERNSHIP REPORT 2021-2022

Fig: 3.13 Adding New stock to the table

Fig: 3.14 About Me Page

Dept. of CSE, C.E.C Page 24

INTERNSHIP REPORT 2021-2022

CHAPTER 4

REFLECTION
The internship from Bitspark Technology was very useful. The training was effective and
taught us the efficient ways to build solutions to the problem statements within a given
time. The best part about internships was that relevant experience and knowledge about
various technologies. The trainer had a different way of teaching where he made sure that
we understood the concepts by giving us time to practise the concepts practically. The
effective training throughout the internship helped us to take the assessment without any
difficulties.

The idea of internship program sees merit in attempting to shorten the period on training
that is often significant duration to orient the trainee or newly inducted person onto the
project. The internship covered the concepts of front end development techniques like
HTML, CSS, JavaScript that is used to design web apps, games and much more. It is and
has great tools, libraries and frameworks.

In this Front End Development internship, we learnt the basics like HTML structure,
Elements, Forms, CSS. We also got an opportunity to know about JavaScript, PHP and
Ruby on Rails. We also did two assignment and project on Web Development.

The internship session has been a great learning journey helping the participants in the
internship program to understand the concepts of Web Development. It also helped us
improve our logical thinking. It helped us to improve our communication skills. They
taught us to manage the time so that we could code maximum in limited or specified time.
We realised that soft skills contribute to a positive work environment and help us
maintain an efficient workflow.

Dept. of CSE, C.E.C Page 25

INTERNSHIP REPORT 2021-2022
CHAPTER 5

CONCLUSION
The need for internship is more emergent as one need to be oriented with self-learning
capacities required at a very short notice in industry. Got to know the industrial standards,
the skills that are required to help us contribute and grow with the industry, the ability of
learning by our own, logical thinking and many more. The internship program has made
me understand the career opportunities that can be explored. An understanding is grown
about the lifelong learning one need to sustain in the industry and the curious and open-
minded attitude one need to have for the same.

The internship helped in improving the interpersonal skills. In this internship, we learnt
how to design web pages. The trainer also helped us in improving our logical thinking by
giving us small assignments to write our own codes. Some of the technical outcomes of
the training are that we can logically analyse and provide considerable solutions.

Dept. of CSE, C.E.C Page 26