React / Typescript Tutorial - Build a Quiz App
video description
Date: 2022-03-14
Related videos
Comments and reviews: 10
Peivaston
TypeError: cannot read property 'map' of undefined. what should i do?
import React from -react-;-
type Props = --
question: string;-
answers: string[];-
callback: any;-
userAnswer: any;-
questionNr: number;-
totalQuestions: number;-
--
const QuestionCard: React.FC = ( --
question, -
answers,-
callback,-
userAnswer,-
questionNr,-
totalQuestions-
-) => (-
Question: -questionNr- / -totalQuestions--
-answers.map(answer => (-
))--
);-
export default QuestionCard;
reply
TypeError: cannot read property 'map' of undefined. what should i do?
import React from -react-;-
type Props = --
question: string;-
answers: string[];-
callback: any;-
userAnswer: any;-
questionNr: number;-
totalQuestions: number;-
--
const QuestionCard: React.FC = ( --
question, -
answers,-
callback,-
userAnswer,-
questionNr,-
totalQuestions-
-) => (-
Question: -questionNr- / -totalQuestions--
-answers.map(answer => (-
))--
);-
export default QuestionCard;
reply
itech
Informative and easy to follow. BUT, NOT SMART teaching beginners to use -Dangerously Set innerHTML-. Even if you say it's -ok- to use. What benefit is a beginner getting out of this? You're teaching beginners dangerous and bad habits that you have. No one mentions in the comments because they don't even realize. It'd be best to teach how to make a quiz app without putting high risk, and obscure things into an easy friendly teaching app. Cheapens the whole project and makes it useless. What's worst is you use it multiple times...
reply
Informative and easy to follow. BUT, NOT SMART teaching beginners to use -Dangerously Set innerHTML-. Even if you say it's -ok- to use. What benefit is a beginner getting out of this? You're teaching beginners dangerous and bad habits that you have. No one mentions in the comments because they don't even realize. It'd be best to teach how to make a quiz app without putting high risk, and obscure things into an easy friendly teaching app. Cheapens the whole project and makes it useless. What's worst is you use it multiple times...
reply
nicola
Bonjour,
Hello,-
Thank you again for this tutorial which is very well explaining just a small problem at the -answers.map- level-
-which returns an undefined value I check on the git restart the project after having downloaded it is the error is the same the map in itself is good but the value which is returned is undefined which makes the program crash an idea ?
reply
Bonjour,
Hello,-
Thank you again for this tutorial which is very well explaining just a small problem at the -answers.map- level-
-which returns an undefined value I check on the git restart the project after having downloaded it is the error is the same the map in itself is good but the value which is returned is undefined which makes the program crash an idea ?
reply
Marco
dangerouslysetinnerhtml - why it is necessary - Why not just pass: -question- or answer -answer- -
it was my understanding that babel in react would convert JSX into JS as well as HTML but maybe I am wrong. So the question is why using dangerouslysetinnerhtml to put directly HTML instead of JSX when we can do that normally? what is the point of or the differences?
reply
dangerouslysetinnerhtml - why it is necessary - Why not just pass: -question- or answer -answer- -
it was my understanding that babel in react would convert JSX into JS as well as HTML but maybe I am wrong. So the question is why using dangerouslysetinnerhtml to put directly HTML instead of JSX when we can do that normally? what is the point of or the differences?
reply
damircast.
I have a question at 35:59 Here you used an arrow function WITHOUT curly parenthesis - -, if I use them, I get 'undefined' for my answers-array at 38:32. Why does removing curly parenthesis shows the correct output?
reply
I have a question at 35:59 Here you used an arrow function WITHOUT curly parenthesis - -, if I use them, I get 'undefined' for my answers-array at 38:32. Why does removing curly parenthesis shows the correct output?
reply
Martin
For those stuck as I was for a while with a TS error:
When he applies an OR to the Props using a 'Pipe', it looks like a slash. That's due to the confusing font.
Use a Single Pipe - to declare 'OR' in Typescript
reply
For those stuck as I was for a while with a TS error:
When he applies an OR to the Props using a 'Pipe', it looks like a slash. That's due to the confusing font.
Use a Single Pipe - to declare 'OR' in Typescript
reply
Isabelly
after using -.json()- when fetching the endpoint, the data is displayed in literal unicode. Like the symbol ' is being displayed as '. It happened with several other symbols. Does anyone know how to fix it?
reply
after using -.json()- when fetching the endpoint, the data is displayed in literal unicode. Like the symbol ' is being displayed as '. It happened with several other symbols. Does anyone know how to fix it?
reply
Alex
If anyone has any issues with dependencies after running the first -npm start- remove the -node_modules- folder from your desktop or home directory(if you're on Linux)
reply
If anyone has any issues with dependencies after running the first -npm start- remove the -node_modules- folder from your desktop or home directory(if you're on Linux)
reply
James
Ok tutorial. Very little to no explanation of how everything works. Another one of these tutorials that you just copy along but unfortunately not really learn much.
reply
Ok tutorial. Very little to no explanation of how everything works. Another one of these tutorials that you just copy along but unfortunately not really learn much.
reply
VaniaD
Great tut Thank you, Apr/2021 note if you are using react-17 make it won't work, downgraded goes fine. Thank you again, hope to see more good code from you.
reply
Great tut Thank you, Apr/2021 note if you are using react-17 make it won't work, downgraded goes fine. Thank you again, hope to see more good code from you.
reply
Add a review, comment
Other channel videos
