0% found this document useful (0 votes)
11 views26 pages

Upda Intern Report 5

Good

Uploaded by

jagpreet
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
11 views26 pages

Upda Intern Report 5

Good

Uploaded by

jagpreet
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 26

Unified Mentor Private Limited

Internship Program

Name: Jagpreet Singh


Plan: 2 month internship
Domain: Web Development Intern
Batch Dates: 20-05-2024 to 20-07-2024
Mail ID: [email protected]
Internship ID: UMIP10244
Fees: 399
Projects Done: 3
Problem Statement

Project Name: Interactive Resume

The problem statement is to create a interactive online resume using HTML, CSS
and JavaScript. An interactive resume is a way to showcase our skills and
experience. The interactive resume should include animations, interactive
elements and engaging visuals. Interactive Resume should be responsive and look
good on various screen.
Why this problem statement is there?

This problem statement help us to stand out of crowd. It helps us to create a


difference between job seekers and professional. By using animations, interactive
element and engaging visuals we make dynamic and impactful presence.
Project 1: Interactive Resume

Linked CSS file to HTML file in head tag using <link> tag. Linked JavaScript file to
HTML file using script tag in body tag. First we implemented navigation menu
using <nav> tag. Inside <nav> element, an unordered list <ul> is used to structure
the navigation items. Inside which <li> is contained. Each list item contain an
anchor <a> element. Using <a> element we ensure navigation to different section
of resume. Added profile image using <img> tag. Created different section for
Personal Information, Education, Skills, Work Experience and Projects using
<section> tag.
Project 1: Interactive Resume

<section class=”resume” id=”post1”> define section element with a class name


“resume” and ID “post1”. The <div id=”container--main”> is used to apply specific
CSS style. Created buttons using <button> tag. Added functionality to buttons
using JavaScript. Where when we will click on button it will display pop-ups.
Project 1: Interactive Resume

The first line of JavaScript code ensure that inside event listener will only run when
entire HTML document is fully loaded. ‘myButton1’ is the button when clicked will
display the popup. An event listener is added to ‘myButton1’ . Website is
responsive.
Project 1: Interactive Resume, Screenshot of Result
Project 1: Interactive Resume, Screenshot of Result
Problem Statement

Project Name: Interactive Quiz

The problem statement is to create a interactive quiz using HTML, CSS and
JavaScript. An interactive quiz contain multiple choice question and it should
display the score at the end. Create a quiz that can handle a dynamic number of
questions and answer choices.
Why this problem statement is there?

This problem statement is relevant because it provide interactive and engaging


content in field of education. It emphasizes the importance of creating dynamic
and user friendly web application that provide immediate feedback and enhance
user experience.
Project 2: Interactive Quiz

HTML file is used to structure the quiz. Such as submit button using <button> tag.
In CSS file, .question-image is used to size the image used in questions. In
selecting a option, cursor is used as pointer using command cursor: pointer. In
JavaScript file, questions and answers are stored as JavaScript object.
Implemented shuffle function which randomly shuffle the elements of the array.
Implemented a 10-second countdown timer that updates an HTML element with
the remaining time every second. loadQuestion() function updates the content of
an HTML page to display a specific question, its image, and its answer options
dynamically.
Project 2: Interactive Quiz, Screenshot of Result
Project 2: Interactive Quiz, Screenshot of Result
Problem Statement

Project Name: Blog Website

The problem statement is to create a blog website using HTML, CSS and
JavaScript. Implement a navigation menu that allow user to navigate between
different blog. We need to add comments to each blog post. Blog website should
be responsive and look good on various screen.
Why this problem statement is there?

It helps in learning the basics of web development. HTML structures the content,
CSS styles it, and JavaScript adds interactivity, forming the foundation of web
development.
Project 3: Blog Website

First we implemented navigation menu using <nav> tag. Added social media
sharing icons and added them functionality using anchor tag. Added three Blog
post in HTML file using three <div> tag. Each Blog post is linked to separate HTML
file using anchor tag. Added background color to each <div> class in CSS.
Decorated the navigation menu. Added font size, margin to the post date and post
description. Implemented smooth scrolling using JavaScript. searchPosts()
function filters and displays posts based on whether the search query matches the
content in the post's title or description. Each blog post also have single HTML file
where description about each Blog post is given.
Project 3: Blog Website

Also each Blog post has comment section. Comment section is implemented
using <form> tag. The submit button is handled to add new comment. The
comments_arr array is intialized as an empty array. Comments does not disappear
after refreshing page. Website is responsive.
Project 3: Blog Website, Screenshot of Result
Project 3: Blog Website, Screenshot of Result
Project 3: Blog Website, Screenshot of Result
Project 3: Blog Website, Screenshot of Result
Project 3: Blog Website, Screenshot of Result
Project 3: Blog Website, Screenshot of Result
Project 3: Blog Website, Screenshot of Result
Project 3: Blog Website, Screenshot of Result
Project 3: Blog Website, Screenshot of Result

You might also like