i completed three projects from this playlist projects are good but please its a request to please also explain the javascript code properly it will be great if you explain in detail for javascript codes because it gets hard for freshers
this video struck an idea for me I am going to use a quiz and trivia page based on my own niche and maybe make money out of it --ill go ahead and consider making my own quiz app soon tnks
please also tell how to put timer for each question, atlast how to put a pie chart which notices how many are correct in green and wrong as red Please provide tutorials
New viewers k liye aik guide A "question" property (string) An "answer" property (array of objects) A "text" property (string) A "correct" property (boolean)
It'd be nice if this had (1.) Questions number limit, meaning if I have 100 questions end each session at 50 and (2.) shuffle questions function... Other than that AWESOME training video! Thanks.
Awesome lesson. For upcoming tutorials please use live server split the screen into two parts, one side show the code and on the other let us see the live render so we see the changes in real time throughout the tutorials. Keep up the good work.
I don't know how to thank this guy ❤ Next level ! easiest explanation .... if you are a beginner and want to enhance your skillset on JS follow this guy man
I follow up the whole code It really worked ......but I am unable to run the Java script yar ...... please suggest a solution ...yar Only script is not showing over the app other work too fluently. After rechecking the .....i Got the whole concept 😍😍😍 thanksss a lot for teaching this much easy way n perfectly.I really made it .😁best way uhh were teaching
Also got another question about JS syntax. Why would you code something such as correct: false correct: true vs true: no false: yes or true: 1 true: 0 false: 1 false: 0 I guess, why would one syntax be the ultimately correct way vs other ways? It makes coding look more like rote memorization vs a logical process.
Your videos are really helpful, only thing I need to mention is when you are writing code please explain it also, dont say this format or code, explain it instead
Wonderful tutorial. Simple and easy to follow. Can you please show me how to save the quiz in local storage and reset the local storage when you restart the quiz
hey! your videos are amazing, I just want to know the best place to study about JavaScript properties which I don't know about... when I was watching this video I didn't know about 'dataset'.
Question, how did you change the default font color of your code in VS code? My JS colors are looking different than the colors displayed here, and I really like the colors you have compared to my own.
You need to download extension to change theme of code. Extension tab is on the left site of screen. I think you Can google "theme for code VS code" and you can choose one you like and then find and download theme extension in VS
well event though im beginner, i had a doubt ...Like using dataset and classList to store the correct answer is not safe right?? the user would just use developer element to get answer. It would be better to use a indexing method or logical operator operation
For those who are lazy, I gave the question format to chatGPT and had it create a bunch of trivia questions for me.... relating to the lord of the rings, star wars, and harry potter...
agar kisis ko ye problem aa raha ki configuration not found to notedpad se file save karte samay .xml format laga do .txt ki jagah aur open with me jakar edge ko sel karke always use this to open xml format par click kar do mera bhi ho gaya finally
If I want to add image such as a watermelon's image and say which vegetable is this ? For adding image and connect with it which things need to change actually? If I just add image of vegetables of every question's place in js , will it work?
Good day Many thanks for the great contributions to knowledge. I tried this, but the js code did not respond. I even follow it line by line just like yours. . what should I do
hello sir , your video are really helpful and your voice is very good i'm lot of learn in your video ..keep creating new design and hover , animation effect
Hello Avinash, Nice video and very easy and simplified. I want to ask you, after making an app like this, how do we make it live or as an app. I understand that this is for tutorial. What are the next steps into it. How do we go about it. Please guide on this.
👉 My JavaScript Advanced Course: greatstack.dev/go/javascript-course (75% Discount)
Avinash is a true programmer. He knows well every corner of Javascript. Kudos!
That 30 javascript projects helps a lot
The video has 30 minutes, But it took me 2 hours to complete. No errors or bugs ...
That's okay. It take time to complete. Keep learning.
Can you give me Source code please?
It took me 2 day and I'm not finished .I don't know but I think he made it hard in the code
"Excellent tutorial! Clear instructions for building a quiz app with HTML, CSS, and JavaScript. Highly recommended."
Is the code working or not...like if i coded along the video ??
What’s the quotes for? I’m assuming it didn’t work for you?
i completed three projects from this playlist projects are good but please its a request to please also explain the javascript code properly it will be great if you explain in detail for javascript codes because it gets hard for freshers
true what's the point of just coding
Can't explain how far you have helped me......!!
Even chatGPT was not able to solve my problem but you did....!!
What was the problem?
@@AibekJustForStudy Thanks for asking but I don't remember right now because I posted this comment 1 year back 😅
You are a teacher, your code is clear, your way of teaching is making us easy understand the codes.
Bro I need this code
For those who need it:
* {
margin: 0;
padding : 0;
font-family: 'Poppins' , sans-serif;
box-sizing: border-box;
}
this video struck an idea for me I am going to use a quiz and trivia page based on my own niche and maybe make money out of it --ill go ahead and consider making my own quiz app soon tnks
please also tell how to put timer for each question,
atlast how to put a pie chart which notices how many are correct in green and wrong as red Please provide tutorials
New viewers k liye aik guide
A "question" property (string)
An "answer" property (array of objects)
A "text" property (string)
A "correct" property (boolean)
It'd be nice if this had (1.) Questions number limit, meaning if I have 100 questions end each session at 50 and (2.) shuffle questions function... Other than that AWESOME training video! Thanks.
"Excellent quiz app tutorial! Clear explanations and easy-to-follow steps using HTML, CSS, and JavaScript."
Why’d you post the same thing twice?
Awesome lesson. For upcoming tutorials please use live server split the screen into two parts, one side show the code and on the other let us see the live render so we see the changes in real time throughout the tutorials. Keep up the good work.
can you share code link for this project
I don't know how to thank this guy ❤ Next level ! easiest explanation .... if you are a beginner and want to enhance your skillset on JS follow this guy man
Avinash, You are a hero. You make coding very easy for me to learn. Thank you.
Avinash jii javascript series op
I want to add shuffle function
const shuffleAnswers = (answers) => {
for (let i = answers.length - 1; i > 0; i--) {
const j = Math.floor(Math.random() * (i + 1));
[answers[i], answers[j]] = [answers[j], answers[i]];
}
}
Hi! Where in the source code do I have to insert this?
I follow up the whole code It really worked ......but I am unable to run the Java script yar ...... please suggest a solution ...yar
Only script is not showing over the app other work too fluently.
After rechecking the .....i Got the whole concept 😍😍😍 thanksss a lot for teaching this much easy way n perfectly.I really made it .😁best way uhh were teaching
same here script is not showing what is the issue can please tell me
@@bhoomikasn5094 make sure you import the js in html code at bottom
i am facing same problem
Next Level Javascript literally
Also got another question about JS syntax. Why would you code something such as
correct: false
correct: true
vs
true: no
false: yes
or
true: 1
true: 0
false: 1
false: 0
I guess, why would one syntax be the ultimately correct way vs other ways? It makes coding look more like rote memorization vs a logical process.
Your videos are really helpful, only thing I need to mention is when you are writing code please explain it also, dont say this format or code, explain it instead
This is exactly what I was looking for, and you made it so simple! Thank you so much!
For those who are getting the next question's option added to the previous qsn; Just add the resetState(); to beginning of showQuestion();
Thank you bro it helps me lot
I successfully executed quiz website
This tutorial has helped me so much. Thank you, I'm now a subscriber and will be practising my javascript skills with your 30day JS code playlist.
Your java script part runs ?? mine js part does not making any changes why T_T??
You have no idea how much this has helped me! Thank you!
here is an easier version:
Quiz App
Score: 0
const questions = [
{
question: "What is the capital of France?",
options: ["Paris", "London", "Berlin", "Madrid"],
answer: "Paris"
},
{
question: "Which planet is known as the Red Planet?",
options: ["Earth", "Mars", "Venus", "Jupiter"],
answer: "Mars"
},
{
question: "What is the largest mammal in the world?",
options: ["Elephant", "Giraffe", "Blue Whale", "Hippopotamus"],
answer: "Blue Whale"
},
{
question: "What is the chemical symbol for gold?",
options: ["Go", "Au", "Ag", "Ge"],
answer: "Au"
}
];
let currentQuestionIndex = 0;
let score = 0;
const questionElement = document.getElementById('question');
const optionsElement = document.getElementById('options');
const scoreElement = document.getElementById('score');
function displayQuestion() {
const currentQuestion = questions[currentQuestionIndex];
questionElement.textContent = currentQuestion.question;
optionsElement.innerHTML = '';
currentQuestion.options.forEach((option, index) => {
const button = document.createElement('button');
button.textContent = option;
button.addEventListener('click', () => checkAnswer(option));
optionsElement.appendChild(button);
});
}
function checkAnswer(selectedOption) {
const currentQuestion = questions[currentQuestionIndex];
if (selectedOption === currentQuestion.answer) {
score++;
}
currentQuestionIndex++;
if (currentQuestionIndex < questions.length) {
displayQuestion();
} else {
showResult();
}
}
function showResult() {
questionElement.textContent = 'Quiz Completed!';
optionsElement.innerHTML = '';
scoreElement.textContent = `Your Score: ${score} / ${questions.length}`;
}
displayQuestion();
Hello
doing this project today og
This is very nice, but it makes long answers verbose on the code. The code will have the answer written twice, every time.
Thanks a lot but can you help drop code for the admin dashboard that can be used to update questions to the website for a school
Wonderful tutorial. Simple and easy to follow. Can you please show me how to save the quiz in local storage and reset the local storage when you restart the quiz
Coming from someone who has been frustrated..Thank you So mmuch, This was really helpful, was what I needed
I think i'm the only one that found this hard to grasp!
I have learned to much things from this video
Glad you liked it. Thanks for your comment. 😊
But not English
Very Helpful and learned new things also
Glad to hear that. Thank you.
Amazing Lesson. My only problem is why the quiz does not work even after writing it correctly.
Same here dude ......
if u get the perfect One . Will u share to the Comment ??
same here. My js has a problem, it didn't connected to the html even I has insert its link
Nice explanation sir and easy to understand keep going 😊...
Thanks a lot 😊 Keep coding.
thank you brother , your tutorials are clear and simple , great job ! subscribed
Merci pour tout, ce fût si facile avec vous. Very, very, very good
you are the greet teacher in my learning process
hey! your videos are amazing, I just want to know the best place to study about JavaScript properties which I don't know about... when I was watching this video I didn't know about 'dataset'.
Question, how did you change the default font color of your code in VS code? My JS colors are looking different than the colors displayed here, and I really like the colors you have compared to my own.
You need to download extension to change theme of code. Extension tab is on the left site of screen. I think you Can google "theme for code VS code" and you can choose one you like and then find and download theme extension in VS
Change the theme of VS Code from the settings option located in the bottom left corner. Each theme has its own font color.
I've made one myself.. but tbe design is awesome
Please can you share
Answers are not showing on the button
@@Ifelola01 did you got the solution?
Me too
Thank you very much Sir🙏
Glad you liked it. You are welcome! 😊
This channal the best in You tube. Thank you for Video.
Thank you so much ❤❤ It worked🤗🤗🤗
You're welcome. 😊 Keep coding.
Please give me source code 🙏🏻
Because mine only shows answers 1 2 3 4 ...
So please give me source code
well event though im beginner, i had a doubt ...Like using dataset and classList to store the correct answer is not safe right?? the user would just use developer element to get answer. It would be better to use a indexing method or logical operator operation
Thanks you Avinash sir
..... Done
Thanks for ur best teaching sir. ❤😊
Thank so much for your tutorial, but I have problem on my code, why ${score} doesn't work?
I got the mistake it supposed to use `` , instead of ''
Nice video ,,,you made me to have no fear in JavaScript again.... thanks a lot
thank you from Istanbul/turkey
Thank you so much , next level of explanation sir
Really helpful sir.....Thankyou so much for your efforts...
For those who are lazy, I gave the question format to chatGPT and had it create a bunch of trivia questions for me.... relating to the lord of the rings, star wars, and harry potter...
Sir I have a doubt if I wants to add approx 10x questions then how to make data base in this type of application
Learn Backbend
Thanks a lot from Uzbekistan! I have leaned a lot from your projects :)
it's bit harder for beginner in my opinion . recommended to do this after next 4-5 projects if you're new to js
agar kisis ko ye problem aa raha ki configuration not found to notedpad se file save karte samay .xml format laga do .txt ki jagah aur open with me jakar edge ko sel karke always use this to open xml format par click kar do mera bhi ho gaya finally
A big salute for you sir 🙇
Thank you so much ..
I have learned a lot of things today
Well explained, thanks!
omg thaaaanks, i learning so mutch here, and you help-me with my project!
❤❤ simple, easy to understand project.. thanks
really you understand this r just copy the code
Thank you so much. I watched this for reference to create my portfolio .so helpful
Congratulations for 800k 😁🔥🔥🔥🔥🔥
If I want to add image such as a watermelon's image and say which vegetable is this ?
For adding image and connect with it which things need to change actually?
If I just add image of vegetables of every question's place in js , will it work?
thank you very much sir
your explanation is so clear
Thank you so much. You're channel is so good.
Nice Video!!! But Unfortunately not working after the Answer names!!
Good day
Many thanks for the great contributions to knowledge.
I tried this, but the js code did not respond.
I even follow it line by line just like yours.
. what should I do
you are doing great job... thank you so much
I love your videos so much!!! You have been teaching me so well and I can't thank you enough.
Thank you for this Easy Tutorial. Please keep creating more JavaScript tutorials. The way you simplify code is amazing, keep up the good work.
Amazing tutorial but I had run into a problem in the line of code that showed the score.
Thank you so much...
Glad you liked it. You're welcome! 😊
How to add image to to the quiz?
Thank you so much teacher :)
Pay first then download projects you mean?
Sir please do a video how to integrate this website with Php & mysql
Avinash is a god amongst mortals.
thanks so much
You're welcome! Keep coding.😊
Amazing work brother!
Great video, how do I add a timer to the quiz. So let's say 50 questions will have 20 minutes to answer questions.
if u findout any solution regarding how to add timer
pls dm me
Hi did you find a solution how to add timer to this quiz?
Your tutorial is awesome. Pls upload source code of project too.
thank you so much this code of yours help me at very crucial movement
Thank you so much sir for this useful video 🙏🙏
what if i want that user should be able to add questions and options ?
Please provide time set in this quiz for the next video.❤
Can I add Images to question?
hello sir , your video are really helpful and your voice is very good i'm lot of learn in your video ..keep creating new design and hover , animation effect
Than very much!
Hello Avinash, Nice video and very easy and simplified. I want to ask you, after making an app like this, how do we make it live or as an app. I understand that this is for tutorial. What are the next steps into it. How do we go about it. Please guide on this.
If you're code is not working then call the startquiz function in the last
Thanks a lot that was great, but what does dataset do??❤❤
thank you! This was very helpful and I learnt a lot!
I also want to say thank you very much!
Hey, can you adjust something like for math quiz?
bro it would be more and more helpful if you had customized the result area like adding percentage and others
Hello, may I ask if I can use this to create a forecasting assessment test on a Website?
Amazing work, thanks so much
Amazing. And how we can achieve different backgrounds(images) for each question? Thank you.
hi thank you for good tutorial
do you have the source on git?
how can i have the source?
btw largest desert in the world is Sahara