ASMR Programming - Responsive Dashboard Design - No Talking

Create a Responsive Dashboard For an Ecommerce Website using HTML, CSS, and JavaScript.

In this tutorial, I'm going to show you how to use modern HTML, CSS, and JavaScript to create a completely responsive dashboard with mobile menu functionality. We'll be using CSS Grid, CSS Flexbox, Media queries for our responsive design, and CSS transitions for some cool animation effects. This dashboard design is responsive in all devices!

Keyboard Info : Epomaker TH80 X
Youtube : @Epomaker

Join the full "100 Days Of JavaScript Code - Web Development Bootcamp" course :

source of all projects also will upload in AsmrProg github page :

Video Contents :

00:00:00 - Intro
00:01:07 - Warming hands
00:01:15 - Main codes
00:01:48 - Adding Icons and Fonts
00:02:42 - Left section html
00:07:02 - Main styles
00:07:57 - Left section styles
00:10:03 - Sidebar styles
00:16:25 - Analytics html
00:20:58 - Main section styles
00:21:34 - Header styles
00:22:59 - Separator styles
00:25:08 - Analytics styles
00:32:17 - Planning html
00:36:24 - Date styles
00:37:25 - Planning styles
00:42:26 - Top right html
00:43:43 - Top right styles
00:47:14 - Right section html
00:49:37 - Right section styles
00:55:22 - 1200px responsive
00:57:15 - 992px responsive
01:02:40 - Mobile menu
01:04:33 - Sidebar items
01:06:19 - 768px responsive
01:07:46 - Final Result

Other Video's :

Subscriptions, good comments and likes are great support for me 😍
Don't re-upload or edit the videos on your channel.
All copyrights by AsmrProg.

About AsmrProg Channel :

Here I upload ASMR programming tutorials related to HTML, CSS, Sass, JavaScript, React, PHP, Frameworks such as Bootstrap and more along with creative UI/UX Designs.
AsmrProg is a community for web developers from all levels to learn and grow their skills in front-end and back-end web development.

AsmrProg
Asmr Prog
ASMR Programming
ASMR Coding
ASMR keyboard typing
ASMR web design
ASMR coding html
ASMR coding website
No Talking ASMR
No Talking Coding
No Talking Programming

[AsmrProg]

Hi, we have a new Responsive Dashboard Design after a while, Do you want we have a playlist for it? Write here in comments 😉
Please Like video to support my channel 🙏❤️

[СергейКр-щс]

Wow, you know all the HEX colors, fonts, and everything else by heart.

[gunawanmigi]

cool..

i really loved it ..
i spend 15minutes for make login button and decide ask to my asistance (chatgpt)
wolaahhh..

[pouriarezaei]

baba das khosh ajab chizi zadi damet garm kheili keyf kardam 👏👏👏

[furiy]

Hi ! Nice vid like everytime ! Could you do a video on what extensions you use to make your VS Code like nicer plz ?

[oneapp]

would be nice if you make a vid about elements inside the dashboard, like buttons and textfields and other usefull stuffs for dashboard...

[milad.hz]

By watching your videos, I get more energy to continue programming, why don't you create a programming course on YouTube?

[monstermac-qh]

Hi Awesome work I loved it,
can I ask what the best way to build a frontend of the website or dashboard ?
I mean we can build it using bootstrap or tailwind, and we can as well use HTML and CSS directly same your work. But the css frameworks is not better and faster ?

Hi great Video!! I have a question, it is possible to click in a button and not let the page reloads? Can you make a video about it? or maybe you already have one idk.. thanks!

[snapesrds]

Could you please mention what you are using in this project, such as Bootstrap or Tailwind? It will make it easier to understand.

[Sebastian-zscp]

How do I start learning HTML CSS without feedback on the code? I have 3 years of IT Vocational training on the job no UNI in Germany. I have expert figma designs from frontendmetor to practice, but I don't know how to prepare to implement this.

[cebucoder]

Hi, which app did you use for the mouse click effect?

[mmvetrivelsanthi]

Sir please do an program auto update in the program we should not mention no of course completed in coding

[thanhcongnguyen]

hi, how can the size of your window appear at 55:25 ? I would like to know !

[lorik]

Can you tell me which themes are you using?

[SandeepRaj-pwer]

Where i can get logo. 😢 please mention about in comment section

[adis]

Please create admin template like this one using css framework

[sankarreddy]

Yes but when you start backend videos bro

[AshikRahman-fwsv]

Full Stack Payment Gateway Roadmap 2024

[Nanettemanoir-ggkp]

Can you link the overhead camera arm that you are using?