Add an official React FAQ to the docs

[markerikson]

Note: I originally reported this in facebook/react#10740 . Please see that thread for prior discussion.

I wrote the Redux FAQ last year, and it's been pretty helpful for answering actual frequently asked questions. It'd be great if we could add a similar FAQ directly to the React docs.

Tim Arney already has a standalone "React FAQ" site at https://reactfaq.site/ that would be a great starting point for a lot of the material. My React/Redux links list is also a useful source of info in general.

I'm opening this up as a place to discuss possible formatting for a React FAQ, as well as possible topics and volunteers to help write it.

Some thoughts, based on things I've seen and suggestions from the original thread:

A lot of the FAQs I see aren't necessarily about React exactly, but they come up enough and are related enough to be worth trying to answer.

My initial suggestions:

• A section on AJAX calls
  • How can I make a call? (Point to common libs)
  • Where do I make a call, constructor/cWM/cDM ?
• A section on method binding necessity and approaches
• Function passing and references
  • The difference between passing a reference to a function and calling it
  • How to pass a parameter to a function as a handler ( onClick={() => someFunc("someParam")} ) , which as an FAQ is "why is my function being called whenever I re-render?" because they're doing onClick={someFunc("someParam")}

Suggestions from @satiewaltz

Due to React's highly unopinionated nature: It'd be great to use it as a small reference to the different styles and approaches people have building React apps. From the component level all the way up to philosophies on architecture.

As well as help people that are new to React accomplish everyday tasks/get over pitfalls be imparted with the full understanding of what is going on behind the scenes.

Here are some ideas on questions that could be apart of a FAQ:

• A section on styling and CSS:
  • What is the difference between inline styles and CSS?
    • What are ways to do JavaScript animation in React?
    • Can I build animations using React's setState()?
  • A section on common performance issues regarding state updates.
  • A section on state and setState():
    • What setState() does exactly?
    • How do I do ordered state updates?
    • What is the difference between passing an object or a function in setState()?
  • A section on architecture:
    (It doesn't need to be comprehensive. Acts as an outline of recent developments the community has found when building with React over the years but without giving a side to a certain style):
    • Is there a recommended way to organize a React application's file structure? If not, what are some commonly used strategies?
    • How can I make the transition to React from other component libraries?
  • A section on React's internals:
    • What is the Virtual DOM? What Is the difference between it and the Shadow DOM?
    • What is React's new reconciliation algorithm in React 16?

---

In foresight to the answers to each FAQ in the future: It'd be best to be cautious of not pointing to one method as being particularly superior to another. Unless it's an anti-pattern of course. Due to the many numbers of ways one can build with React. And the differentiating costs and benefits each way can have. ("Common Anti-patterns" sounds like it could be a section of its own perhaps?) Though I could be entirely wrong about this thought of mine.

[alexkrolick]

@bvaughn this one can be marked in-progress as well 🗂

[bvaughn]

Done!

[alexkrolick]

Another good topic would be debugging. See a lot of people asking Q's in Reactiflux that could really benefit from some basic debugger guidance.