100% found this document useful (1 vote)
736 views18 pages

Front-End Web Development Presentation

The document summarizes an industrial training presentation by Nitesh Verma about front-end web development. The presentation covered HTML, CSS, and JavaScript and how they were used to build a portfolio website project. It described the structure and styling of the portfolio site using HTML and CSS and included details on interactive elements implemented with JavaScript. The presentation concluded by emphasizing how a personal portfolio site can help showcase skills and increase online visibility for employers.

Uploaded by

Nitesh verma
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
100% found this document useful (1 vote)
736 views18 pages

Front-End Web Development Presentation

The document summarizes an industrial training presentation by Nitesh Verma about front-end web development. The presentation covered HTML, CSS, and JavaScript and how they were used to build a portfolio website project. It described the structure and styling of the portfolio site using HTML and CSS and included details on interactive elements implemented with JavaScript. The presentation concluded by emphasizing how a personal portfolio site can help showcase skills and increase online visibility for employers.

Uploaded by

Nitesh verma
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/ 18

RAJASTHAN TECHNICAL UNIVERSITY, KOTA

Department of Computer Science Engineering


Industrial Training Presentation-2023
V Semester
Presentation by: Submitted to:
Name: Nitesh Verma Mr. Chote Lal Sir
College Roll No.: 21/450 Assistant Professor (Department of Computer Science)
University Roll No.: 21EUCIT038
COURSE DESCRIPTION

• Frontend Web Development is an essential skill for anyone looking to build user-
friendly, responsive, and visually appealing websites. This comprehensive course is
designed to equip you with the knowledge and practical skills needed to become a
proficient frontend web developer.
• The course focused on the foundational blocks of Front-End Web Development,
namely:
• HTML
• CSS
• JavaScript
• The course discussed about the various ways of integrating the technologies of
HTML, CSS and JavaScript to design a powerful web user interface while also
teaching about the concept of Git and GitHub which is the industry standard for
branch control.
• The course was also helpful in providing the first-hand experience of working on a
live project alongside fellow IT professionals which provided me with a platform
for recognizing my skills and refining them to a level desired by the industry.
INTRODUCTION TO FRONT-END WEB DEVELOPMENT

• Front-End is a subset of web development that


focuses on designing and implementing the user
interface (UI) and user experience (UX) of a
website or web application..
• Front-End Web Development Frontend web
development, also known as front-end development,
is the practice of creating the visual and interactive
components of a website or web application that
users interact with directly in their web browsers.
• This is done using:
• HTML: Creates the structure of webpage
• CSS: Applies style to the webpage
• JavaScript: Adds interactivity and dynamic content to
the webpage
HTML

The HTML code in my project is approx. 40% and is used for:


• Providing the title of the webpage
• Providing the links of social media
• Linking the CSS and JS code with the HTML document
CSS

The use of CSS in my project includes:


• Formatting the keyboard and keys to resemble an actual keyboard
• Formatting the game board to resemble an actual game board with tiles and tile borders
• Colouring the tiles according to the logic provided by the JavaScript code to reflect the hints according to the
answer word
JAVASCRIPT

The HTML code in my project is minimal and is used for:


• I used in typing text animation script
• I used in scroll up button
PROJECT: PORTFOLIO
WEBSITE
• This project was made using HTML, CSS
and JS.
• In this project I have attached my
resume.
• In this project I used sticky social media
icons.
• In this project I have added about me ,
certification , internships and project.
• I also added contact me option in this
website.
PROJECT: PORTFOLIO
WEBSITE

• In this if our arrow icon is not in social


media icons then the only icons will show.
• If we arrow on the social media icons then
the full name of icon will show and you will
get the profile by clicking it.
• I have added contact me in that website so if anyone want to message
PROJECT: PORTFOLIO me then he can directly message me by entering in this.
WEBSITE • After that I will receive that message on email and I want to say
something then I will directly mail him.
PROJECT: PORTFOLIO WEBSITE

• In this I have used typing text animation


in that the word is in the typing form and
can be used 2 or more words to written at
same place.
1:
PROJECT: WORKING • If you want to download the resume then you can download by
clicking on download resume.
PROJECT: WORKING

2:
• If you want to know about my project
then go to my project section and if you
want to see the codes of that project then
you can click on the view button then you
will be redirect to gitub repo.
• 3:
PROJECT: WORKING • If you want to go directly to the menu then you can click on which
you want to go in navbar menu.
PROJECT: WORKING
PROJECT: DEMO

• Project Website Link: https://niteshverma-portfolio.netlify.app/


• GitHub Repo Link: https://github.com/Nitesh288/Portfolio.git
FUTURE SCOPE

• It's A Great First Impression For Employers : If an employer sees your website link in your signature or on your
resume, they’ll likely click on it to see what you’ve built.
• Shows You’re More Than Just A Resume : Because of the flexibility of an online portfolio, you’re able to show your
personality by choosing design, layout and the copy you write.
• Increases Your Visibility And Online Presence : When an employer Googles your name, your professional portfolio will be
one of the first search results that pops up.
CONCLUSION

A personal portfolio website is a great way to showcase your work, skills, and achievements to potential clients,
employers, and collaborators.
THANK YOU!

You might also like

pFad - Phonifier reborn

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.


Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy