In this tutorial, we will teach you HTML, CSS, and JavaScript by building a responsive sales dashboard. We will not be using any CSS frameworks such as Bootstrap to build this dashboard. Instead, we will teach you how to build a layout using CSS Grid and how to make it look good on devices of different sizes using CSS Media Queries.
00:00:00 Introduction
00:00:34 Project Overview
00:01:28 Responsive Design
00:04:47 HTML, CSS, JavaScript and Document Object Model (DOM)
00:06:19 Basic HTML Structure
00:14:28 Layout using CSS Grid
00:27:30 Adding Fonts and Icons
00:32:53 Header
00:38:30 Sidebar
00:44:45 Main Section and Cards
00:50:51 Building Charts using the ApexCharts Library
00:58:36 Responsive Web Design using CSS Media Queries
01:06:26 Outro
Source Code on GitHub: https://github.com/BobsProgrammingAcademy/responsive-sales-dashboard
Subscribe: https://www.youtube.com/@BobsProgrammingAcademy/featured
