SUMMER INTERNSHIP
On
Responsive Web Design
(freeCodeCamp)
Submitted By :-
Barinder Flora
Registration No: 12304104
Program Name: BCA
School of Computer Applications, Lovely
Professional University, Phagwara
(01/July/2025 to 31/July/2025)
Acknowledgment
The opportunity to learn through the Responsive Web Design Developer Certification on
freeCodeCamp has been an immensely valuable and transformative step in my academic
and professional journey. This program not only sharpened my technical skills in HTML,
CSS, and responsive design but also enhanced my creativity, attention to detail, and ability
to approach web development with a user-focused mindset.
I am sincerely grateful to freeCodeCamp for designing such a practical, project-driven
curriculum and for making it freely accessible to learners around the world. The structured
learning path from mastering semantic HTML and advanced CSS techniques to
implementing fully responsive layouts provided me with both the foundational knowledge
and the confidence to create visually appealing, accessible, and mobile-friendly web
interfaces.
I extend my heartfelt thanks to the School of Computer Application, Lovely Professional
University, and the Training and Placement Coordinator for encouraging students to
pursue industry-relevant certifications that bridge the gap between academic theory and
real-world application.
Lastly, I deeply appreciate the support and encouragement of my peers and faculty, whose
motivation and collaboration made this learning journey both engaging and fulfilling.
Barinder Flora
12304104
MOOC Certificate
Table of contents
Sr. No. Description Page No.
1 Introduction of the Course 4
2 Technical Learnings from the course 5
3 Introduction of Mini Project or Technical Assignments 6
4 Details of Mini Project 6
5 a.Interfaces Designed b.Code 7-13
snippets (If any)
1 Introduction of the Course
Responsive Web Design Developer Certification (freeCodeCamp)
A comprehensive, self-paced program representing 300 hours of hands-on
practice and projects, focusing on modern HTML, CSS, and responsive
design principles to create visually appealing, accessible, and mobile-friendly
websites.
Key Skills & Topics Covered
● Semantic HTML5 structure and best practices for accessibility.
● Advanced CSS techniques, including Flexbox, Grid, animations, and
transitions.
● Responsive web design strategies for seamless display across devices.
● Color theory, typography, and design principles for improved UX/UI.
● Building interactive, responsive layouts without relying on frameworks.
● Multiple portfolio-ready projects showcasing design and coding
proficiency.
This certification demonstrates the ability to design and develop responsive,
standards-compliant web interfaces suitable for real-world applications.
2. Technical Learnings – Responsive Web Design Developer Certification
(freeCodeCamp)
HTML & Accessibility
● Mastered semantic HTML5 to create well-structured, accessible webpages that
follow industry best practices.
● Applied WCAG accessibility guidelines to ensure websites are usable by all
audiences, including those using assistive technologies.
CSS & Responsive Design
● Implemented advanced CSS techniques such as Flexbox, Grid, animations, and
transitions to build modern layouts.
● Developed fully responsive websites adaptable to various devices and screen sizes
without reliance on external frameworks.
Design & User Experience
● Applied color theory, typography, and visual hierarchy to improve usability and
aesthetics.
● Created interactive layouts using only HTML and CSS for enhanced engagement.
Practical Application
● Completed multiple portfolio-ready projects demonstrating proficiency in
building responsive, standards-compliant web interfaces.
● Strengthened front-end development workflow using hands-on coding challenges
and best practices for maintainable stylesheets.
3. Project Info: Video Editing Portfolio Website
Project Title:
Responsive Portfolio Website for Video Editor
Description:
This is a responsive, mobile-friendly portfolio website built with HTML and CSS to showcase
my work as a video editor. The site features a clean layout with smooth navigation and
highlights my background, tools I use, and sample video editing projects. It is designed to
represent my creative identity and provide potential clients or collaborators with an easy way
to view my work and contact me.
Key Features:
• Embedded video projects (YouTube or local .mp4)
• About Me section describing editing experience
• Skills section listing tools like Adobe Premiere, After Effects, CapCut
• Responsive design using Flexbox and media queries
• Contact section with email and social media links
Technologies Used:
• HTML5
• CSS3
• Responsive Web Design (Flexbox/Grid)
Goals:
To present a professional online identity, showcase editing capabilities, and make it easy for
viewers to access, view, and engage with my video work across all devices.
CODE :-
Index.html
CODE :-
Style.css
Bibliography or References:-
freeCodeCamp. (n.d.). Responsive Web Design Certification.
https://www.freecodecamp.org/learn/responsive-web-design/
MDN Web Docs. (n.d.). HTML: HyperText Markup Language. Mozilla.
https://developer.mozilla.org/en-US/docs/Web/HTML
MDN Web Docs. (n.d.). CSS: Cascading Style Sheets. Mozilla. https://developer.mozilla.org/en-
US/docs/Web/CSS
W3Schools. (n.d.). HTML and CSS Tutorials. https://www.w3schools.com/
