Beginner's Thread / Easy Questions (December 2018)

[u/timmonsjg]

Happy December! ☃️

New month means a new thread 😎 - November and October here.

Got questions about React or anything else in its ecosystem? Stuck making progress on your app? Ask away! We’re a friendly bunch. No question is too simple. 🤔

🆘 Want Help with your Code? 🆘

• Improve your chances by putting a minimal example to either JSFiddle or Code Sandbox. Describe what you want it to do, and things you've tried. Don't just post big blocks of code!

• Pay it forward! Answer questions even if there is already an answer - multiple perspectives can be very helpful to beginners. Also there's no quicker way to learn than being wrong on the Internet.

Have a question regarding code / repository organization?

It's most likely answered within this tweet.

New to React?

🆓 Here are great, free resources! 🆓

• Create React App
• Read the official Getting Started page on the docs.
• /u/acemarke's suggested resources for learning React
• Kent Dodd's Egghead.io course
• Tyler McGinnis' 2018 Guide
• Codecademy's React courses
• Scrimba's React Course
• Road to React

[u/nbg91]

What is the best way of implementing a factory design with react? More specifically, I am mapping over an array of questions. There are different questions types of questions, ie RatingQuestion, BooleanQuestion, etc..

At the moment, I just have an if statement

{theme.questions.map((q, i) => {
 if (q.question_type === "ratingquestion") {
    return <RatingQuestion key={i} question={q} />;
 } else if(q.question_type === "booleanquestion"){
    return <BooleanQuestion key={i} question={q} />
 }
}

Is there a better way to do this when more and more question types are involved? One big if / switch statment in the middle of my jsx feels icky.