INTERNSHIP REPORT

Front-End Developer
At Rejolt EdTech Pvt Ltd
Web Development, E-LearningPlatform

Submitted By

Humayun Sayeed
Roll No: 1604-19-733-117
Under the guidance of

Mrs. Afreen Sultana

Associate Professor

Muffakham Jah College of Engineering and Technology

Affiliated to Osmania University & Recognized
by AICTE Banjara Hills, Hyderabad-500034

Department of Computer Science and

Engineering (2022-2023)
1
 INDEX

S.no Title Pg.no

1 Certificate 03

2 Acknowledgement 04

3 Introduction 05
Introduction to Web Development
About the Company
My Role and Responsibilities

4 Technical Specifications 10
HTML, CSS, JavaScript and Bootstrap
Other Software Tools

5 Project Overview 11

6 Conclusion 18

2
1. INTERNSHIP CERTIFICATE

3
2. ACKNOWLEDGEMENT
It is proud privilege and duty to acknowledge the kind of help and guidance received from
several people during this internship. It would not have been possible without their valuable
help, cooperation and guidance. I wish to record my sincere gratitude to Dr. S Venu Gopal
Co-Founder of Rejolt EDTech for his constant support. I would also like to thank my team
mates forhelping and supporting me during my internship.

Finally, I would like to take this opportunity to thank my family for their constant support
throughout the internship. I sincerely acknowledge and thank all those who gave directly or
indirectly their support in completion of this internship.

Humayun Sayeed
1604-19-733-117

4
3. INTRODCUTION
INTODUCTION TO WEB DEVELOPMENT
Web development refers to the building, creating, and maintaining of websites. Web
development is the work involved in developing a website for the Internet (World Wide Web).
Web development can range from developing a simple single static page of plain text to
complex web applications, electronic businesses, and social network services.
Web Development can be classified into two ways:
 Frontend Development
 Backend Development

1. Frontend Development: The part of a website that the user interacts directly is termed as front
end. It is also referred to as the ‘client side’ of the application.
Mainly used front-end tools are:
 HTML: HTML stands for HyperText Markup Language. It is used to design the front-
end portion of web pages using markup language. It acts as a skeleton for a website
since it is used to make the structure of a website.
 CSS: Cascading Style Sheets fondly referred to as CSS is a simply designed language
intended to simplify the process of making web pages presentable. It is used to style
our website.
 JavaScript: JavaScript is a scripting language used to provide a dynamic behaviour to
our website.
 Bootstrap: Bootstrap is a free and open-source tool collection for creating responsive
websites and web applications. It is the most popular CSS framework for developing
responsive, mobile-first websites. Nowadays, the websites are perfect for all the
browsers (IE, Firefox, and Chrome) and for all sizes of screens (Desktop, Tablets, and
Phones).

Frontend Frameworks and Libraries:

AngularJS
React.js
Vue.js
jQuery
Bootstrap
Material UI
Tailwind CSS
jQuery UI
Some other libraries and frameworks are: Handlebar.js Backbone.js, Ember.js etc.

2. Backend Development: Backend is the server side of a website. It is the part of the website
that users cannot see and interact. It is the portion of software that does not come in direct contact
with the users. It is used to store and arrange data.
Mainly used backend tools are:
 PHP: PHP is a server-side scripting language designed specifically for web
development.

5
  Java: Java is one of the most popular and widely used programming language. It is
highly scalable.
 Python: Python is a programming language that lets you work quickly and integrate
systems more efficiently.
 Node.js: Node.js is an open source and cross-platform runtime environment for
executing JavaScript code outside a browser.

Back End Frameworks: The list of back end frameworks most commonly used
are: Express, Django, Rails, Laravel, Spring, etc.

3. Comparing Front-End and Back-End Development

Front-End development deals with the design, layout and interactivity. It is basically how you
make a website user-friendly with good animations and images and proper structure. For this,
you need to learn HTML (HyperText Markup Language), CSS (Cascading Style Sheets) and
JavaScript. These are necessary to be learnt as they mark the foundation of web development.
A front-end developer must be really good at HTML, CSS and JavaScript.
HTML is a markup language and contributes to the structure of the website. CSS, as
the name suggests is a styling language that makes a website eye-catching. JavaScript is a
programming language that is mainly used to calculate, manipulate and validate data. Along
with CSS, it is highly recommended to learn a CSS framework. I suggest you to go for
Bootstrap as it is quite easy to implement. So, a front-end developer needs to be good at above
mentioned things along with making websites responsiveness. React is an amazing JavaScript
library which is trending now-a-days. I suggest you to dive into it if you are good at
JavaScript and want to develop eye-catching and stunning websites.
Back-end development deals with the server-side development. It contains behind-the-
scenes activities that occur when performing any action on a website. The backend of the web
consists of the server that hosts the website, an application for running it and a database to
contain the data. There are many languages out of which one can be used as a back-end
language. Some examples are PHP, Java, Python, JavaScript, Node.js and many more. One can
also use popular back-end frameworks like Django, Express, Rails, Laravel and Spring. A
back-end developer’s job is comparatively tougher than front-end developer as a person should
have strong concepts and good implementation skills.

6
Fig-1: Front-End VS Back-End Developer

7
IMPORTANCE OF WEB DEVELOPMENT

Website development is a way to make people aware of the services and/or products you are
offering, understand why your products are relevant and even necessary for them to buy or use,
and see which of your company's qualities set it apart from competitors. Displaying this
information with high-quality images and thought-out presentation will have a large influence
on customers, and it is important to strive towards making your product as relatable and
appealing as possible. Additionally, with website development you can:

1. Communicate with your visitors effectively. Interacting with your audience is vital when it
comes to generating more business. It is viable to make a website that enables you to get in
touch with your customers and prospects, and you can produce valuable content for the
audience associated with the industry or business you're in. Afterwards, post the content on
your blog, share it on social media networks and respond to customers' comments and feedback
promptly. This will show your clients the extent to which you’re concerned about their
satisfaction and responsive to their needs.

2. Improve your connectivity. A website will facilitate things like expanding your reach and
attracting more visitors to your business. Planning to make a responsive website design for
your site will help make it accessible to an extensive range of users spanning several devices,
such as tablets or smartphones. This will increase both your site's exposure and organic traffic.

3. Prove your reliability. A website offers a straightforward method of showing the credibility
of a business, and the way a person represents his business online is vital for attracting more
customers or visitors. Therefore, your website design should be handled in the best possible
way, because a professional presentation speaks volumes as testimony to your business. With
the help of website development, you can add your skills, credentials, experience, expertise
and more in a single place. These details help you earn the trust and confidence of your visitors
and serve as a reference point for customers interested in your business, making it easy for you
to produce leads.

ABOUT THE COMPANY

Rejolt EDTect is an e-learning platform that adopts a “learning by doing” approach, wherein
learners are exposed to real-time industrial tasks and open-source projects, to better
understand a particular topic.
Every project on Rejolt EDTech platform is called a “Mission” and each of these Missions
are divided into multiple smaller scale tasks called “Microtasks”. Missions and Microtasks are
thesecret sauce to make learning more fun, involving and interesting.

8
Rejolt EDTech has a very interactive & informative dashboard that calculates of a lot of metrics like
 The total number of Missions you have completed/are in progress.
 Time taken to complete every Mission in comparison with others on the platform.
 Your productivity on the platform.
 A daily activity calendar.

Fig-2: Dashboard

My Roles and Responsibilities

 Designing and developing a static website and deploying it on GitHub.

 Making the website responsive and structured.
 Writing clear and clean code.
 Providing help and support to other team members.

9
4. Technical Specifications
HTML, CSS, JavaScript and Firebase

HTML
HTML is the standard markup language for creating Web pages. HTML5 is the latest and
most enhanced version of HTML.
 HTML stands for Hyper Text Markup Language
 HTML is the standard markup language for creating Web pages
 HTML describes the structure of a Web page
 HTML consists of a series of elements
 HTML elements tell the browser how to display the content
 HTML elements label pieces of content such as "this is a heading", "this is a
paragraph", "this is a link", etc.

CSS
CSS is the language we use to style an HTML document. CSS describes how HTML elements
should be displayed.
 CSS stands for Cascading Style Sheets.
 CSS describes how HTML elements are to be displayed on screen, paper, or in other
media.
 CSS saves a lot of work. It can control the layout of multiple web pages all at once.
 External stylesheets are stored in CSS files.

JavaScript
JavaScript is the Programming Language for the Web. JavaScript can update and change
both HTML and CSS. JavaScript can calculate, manipulate and validate data.
JavaScript is a scripting or programming language that allows you to implement complex
features on web pages — every time a web page does more than just sit there and display static
information for you to look at — displaying timely content updates, interactive maps, animated
2D/3D graphics, scrolling video jukeboxes, etc. — you can bet that JavaScript is probably
involved.

Firebase
Firebase is a product of Google which helps developers to build, manage, and grow their
apps easily. It helps developers to build their apps faster and in a more secure way. No
programming is required on the firebase side which makes it easy to use its features more
efficiently. It provides services to android, ios, web, unity. It provides cloud storag. It uses
NoSQL for the database for the storage of data.

Other Software tools

 Slack: Slack is a messaging app for business that connects people to the information
they need. Slack brings team communication and collaboration into one place so you
can get more work done, whether you belong to a large enterprise or a small business.

10
5. Project Overview
During my internship, I worked on creating a static Portfolio Website. The website was built
with HTML, CSS, JavaScript and Bootstrap and was deployed on GitHub. The portfolio
website contains my education details, resume, skills, experience and interests along with a
Social Media Links Section. Every person, be it a student or a professional, requires a portfolio
of his own and there can be no better way than to create a website. The portfolio website can
be accessed from anywhere around the world with a unique link.

The highlights of my 1-month internship are as follows:

 Successfully developed my portfolio website and hosted it on GitHub.

 Learnt pushing code to GitHub and creating repositories.

Figures of the Portfolio Website which can be found on the website

Fig-4: Blog Website Overview 1

11
Screenshot

Fig-4: Blog Website Overview 2

12
6. Conclusion

I hereby conclude, by saying that this internship gave me a good experience of how a company
works and how requirements are met.

I learnt many new things during my internship at Rejolt EDTech. I learnt how to make use of
Bootstrap, a CSS framework for making websites responsive and using its different
components. I also learnt about deploying websites on GitHub and the difference between a
static and dynamic website. One of the most important skills I developed during my
internship was time management. Doing the assigned work on time shows a person’s
commitment and dedication to a particular task and paves way for the achievement of high
goals.

Communication and collaboration were the key takeaways from my internship at Rejolt
EDTech. Important announcements and tasks were communicated through Slack – a
messaging and collaboration app for businesses, and I received solutions for my doubts from
the College Ranker Community and mentors.

This internship resulted in helping me bring out my hidden creativity and explore the domain I
liked. The technical knowledge I gained during this internship was invaluable and I am sure this
would help me perform better in my future endeavors.

13