Intern Report 2
Intern Report 2
Internship Program
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?
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?
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 1: Interactive Resume
First we implemented navigation menu using <nav> tag. Implemented the smooth
scrolling using CSS and JavaScript file. Added profile image using <img> tag.
Created different section for Personal Information, Education, Skills, Work
Experience and Projects. Created buttons using <button> tag. Added functionality
to buttons using JavaScript. Where when we will click on button it will display
pop-ups. Website is responsive.
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 3: Blog Website
First we implemented navigation menu using <nav> tag. Added social media
sharing icons. Added three Blog post in HTML file. 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 1: Interactive Resume, Screenshot of Result
Project 1: Interactive Resume, Screenshot of Result
Project 2: Interactive Quiz, Screenshot of Result
Project 2: Interactive Quiz, 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
Project 3: Blog Website, Screenshot of Result