Course Highlights
  • Build their own website using a range of technical skills
  • Easily utilise third party tools to make your site stand out

Overview

What Abilities will Students Get from this Course?

  • Gaining a solid understanding of HTML's foundations to structure online content successfully.
  • JavaScript implementation to provide the portfolio with more dynamic elements and interaction.
  • Designing a responsive layout that works with a range of screens and devices.
  • Integrating online accessibility best practices and guaranteeing an inclusive user experience.
  • Gaining expertise in the design and layout of the portfolio using CSS to improve its visual attractiveness.

How does the Course Guide Learners in Building a Responsive Portfolio?

  • Giving detailed guidelines on how to create and arrange a visually appealing portfolio arrangement.
  • Teaching responsive web design strategies to make sure the portfolio appears well on mobile, tablet, and desktop computers.
  • Showcasing how JavaScript is used with interactive components and dynamic content loading to improve user engagement.
  • Providing activities and examples from everyday life to help students retain the knowledge and abilities they have acquired during the course.
  • Providing advice and methods for enhancing the functionality of the portfolio website and guaranteeing quick loads.
Curriculum

4 Topics
Website Overview
Introduction - Setup
Adding JQuery
Adding Bootstrap

8 Topics
Adding Superslides files
Using Superslides
Creating our own JavaScript file
Adding our own images to the slider
Superslides options
Adding next and previous buttons
Styling the next and previous buttons
Adding a background overlay

2 Topics
Title section HTML
Typed Js

2 Topics
About section HTML
Adding text to the about section

6 Topics
Creating the skills section HTML
Adding the slider
Adding the pie charts
Pie chart options
Styling the charts
Activating the charts on scroll

6 Topics
Creating the stats section HTML
Styling the skills items
Using Font Awesome
Adding the icon to the items
Counting the number up from 0
Counting up on scroll

2 Topics
Creating the contact section HTML
Styling the contact section

12 Topics
Adding Isotope
Adding the filter buttons
Styling the filter buttons
Creating a portfolio item
Portfolio item icons
Viewing items in full screen
Styling the items
Adding an overlay to the items
Adding fly in/out transitions to the buttons
Zooming the images on hover
Filtering items
Bug fix - icons not showing on mobile

1 Topic
Creating the copyright section

5 Topics
Adding the Bootstrap navigation menu
Styling the navigation bar
Sticking navigation bar on scroll
Fixing navigation bugs
Sliding to section on link click

4 Topics
Adding a loading Gif
Fading out the loading indication
Specifying the viewport
Bug fix - images overlapping

  Write a Review

Make a Responsive Portfolio Website: JavaScript and HTML

Go to Paid Course
Frequently Asked Questions
JavaScript gives a portfolio of dynamic elements and interactions that boost user engagement and produce a more interesting and contemporary user experience.
Yes, you can create a fully Dynamic and working website using HTML, CSS and JavaScript.
You can finish this course within a week.
Responsive portfolio adjusts to various screen sizes, giving viewers on PCs, tablets, and mobile devices the best possible viewing experience.
Within the programming community, Google, Microsoft, Facebook, and Amazon are frequently referred to as the "big 4." Any of these companies require you to have a working knowledge of HTML, CSS, and JavaScript in order to get hired.