HTML CSS JS projects (Beginner): 16 projects using HTML CSS and JavaScript

Thank you for the great content, loving it! Currently, following the third project in the list but I noticed a little problem with the JS index for the clock exercise. It actually does not add a 0 for the hours between 1 pm and 9 pm, because the program is reading these as 13 to 22 and only fulfiling the condition of h < 10 by adding a 0 to any hour that is less than 10 but ignoring any other condition thus not adding a 0 for 1pm all the way to 9 pm. I fixed that with the following code:

if (h>= 13 && h<22 ){
h = `0 ${h - 12}`;
}
else if (h < 10) {
h = "0" + h;
}
m = m < 10 ? "0" + m : m;
s = s < 10 ? "0" + s : s;

It seems to work perfectly on my computer, what do you think of it?

hi, on the clock app, with this code will not change AM to PM when it's 12 afternoon!!!

it is practical for me! thx so much

Hi Mate i have started doing your tutorials when i am adding the background imgae it repeats how can i do it so the image covers the whole back ground in 1 go instead of images reperting untill the body is full thank u

Best one yet i know am a noob but this tutorial is clear and on point please continue do more of this

Hello I am from Taiwan , and I saw your video really helpful and easy to follow. I could not thank you enough, you are the genius teacher, I saw so many lesson but I just give up in the middle of lesson, but yours lesson I just go through from the begging to the End and still want to watching again...... I am really thanks you.

Hi Sri why he show me native code

I am learning all your projects ,it gaves me an advantage to learn css, html and JavaScript all at once, you are the best teacher for me thank you for helping.

❤


❤❤❤❤❤ Merci

Thank you for the tutorial, this way I became familiar with all html, css and javascript.

in multiplication app (2nd project) , my score doesnot refresh to zero every time on refreshing the page ,it just continue from the last score e.g 4 ..
plz help me with that

Thank you so much for sharing these tutorials, Im must say is a great tutorial video for all beginner like myself and it helped me out greatly. I just have a question and hopefully you can share some lights. In the digital clock tutorial, the code define the switch from AM to PM is not functioning properly since the h will never exceed 12, is there a solution to this issue and will the minutes and seconds also play a part in it? Much appreciated for your time and best wishes to you!😊

i couldn't figure out how to publish this on github

Hello JS i am a very new beginner with you as my first lessons, I am trying to follow you step by step, meaning each step you are making I pause and do likewise then press play, now I think I hit the wall mind you I am still right at the beginning of the first lesson html, to with me when I right click it doesn't show the live preview: show preview now I don't have that option to click on, I can't tell why but every other steps have been a success until this one?

For Multiplication App, I am not able to print a random number... Instead my browser is printing ${num1}. Can anybody tell what am I possibly doing wrong?

perfect❤❤

i'm just learning english, but I think I quite understand you

I have a doubt in digital clock project ... in ...if(h>12) and the conditions were given...for that it is showing am for morning itself.....can you pls clarify it.

I loved the incorporation of everything in a single project. Instead of just uploading a setup with the css and html already done, you do everything alongside us from scratch. I love your approach, I've learned a ton! Thank you!

You have demystify Web development with these projects. I'm enjoying every bit of the video. Thanks so much, sir.

Kindly simplify this expression as it's taking me more time to understand

great.addEventListener("timer", ( ) => { greatVideo( );

});

merc

I was curious to have more tutorials like this and luckily I found them on your channel, thanks for the effort!

❤❤❤
I suggest a bit of tweaking in the JavaScript code, the part where am is converted to pm so it should be,
if (h >= 12) {
if (h > 12) {
h = h - 12;
}
ampm = "PM";
} else {
ampm = "AM";
}

The reason for this change is that at 12pm the clock doesn't show pm but am.

Why my add event listener not working on multiplication job

they are easy and you actually understand the whole logic behind everything through these line.khamsa-mida

Thank you!

the clock didn't work for me please help

what a great 16 projects man!

Wow! This web app dev tutorial is super amazing! 🌟 Thank you so much, Sahand, for creating such an incredible course. It's truly practical and has made my life much easier. Keep up the fantastic work! 💯, cheers 🍻 , ali

sir could you please send random color generator code

fantastic ❣

I was little nervous bcz i had no clue where have to start JavaScript from basics but now i found your video i feel more confident i will complete all projects as soon as possible .

......thank you a lot for providing us with this video 👍

project 2 : - when ever i start again it shows previous score not from 0 Why?

Did you use any extension for these?

You are great.....

عالی great

let arr=['1','2','3','4','5','6','7','8','9','A','B','C','D','E','F'];
let content = document.querySelectorAll('.content');
window.addEventListener('DOMContentLoaded',function(){

content.forEach((e)=>{
let h='#'
for(i=0;i<6;i++){
let random = Math.floor(Math.random()*arr.length)
h=h+arr[random]
}
e.style.backgroundColor=h
e.textContent=h
})
})

I would also love to inquire, which backend language should I learn. thanks sir. God Bless You.

I have been in web development for only 2 months, I can do good html/CSS code, and learnt JavaScript as well. you have made me appreciate the use of JavaScript and thanks so much for that.

Use of JavaScript functions are not clear and lot of mistakes with the presentations. The function given is not working. That is a waste of time.

Your digital clock is not changed by the difference between AM and PM. Please try to solve your solution

Do you offer online courses Sir?

great projects, thank you very much❤❤

I have a footer with random quotes displaying at every refresh. (SQLite DB) so I animated it using this project. Works great! Thank you.