Intro to react for BEGINNERS revision
Dieses Issue hat noch niemand übernommen.
- Vorherrschende Sprache
- JavaScript
- Sterne
- 11.8k
- Forks
- 7.9k
- Ø Merge
- 1 T. 11 Std.
- Gemergte PRs (30 T.)
- 11
Beschreibung
An exchange of tweets with super friendly @gaearon lead me to convert one of my replies into this ticket. To improve what is on the overview section for beginners here: https://reactjs.org/tutorial/tutorial.html

I suggest the "Overview" section is dedicated to the following and flows like this:
- Explain what a component is (type, class) and that ES6 syntax which for someone with little JS experience looks like a normal JS syntax but it is not. With that hint outline what each term mean.

-
Explain a component's lifecycle briefly before touching on
renderand constructor methods. I think React lifecycle is inspired/affected by iOS/Android lifecycles so why not touch on those, for people like me who came from mobile world. Learning by association is one of the learning methods (I think). -
Now feel free to explain what
renderis and why it must return something (includingnull). -
Now is time to show
Hello Worldnot a shopping list:
class HelloWorld extends React.Component {
render() { //compulsory React method/fucntion
return (
<p className="cssclass"> // a <p> element is also a component, className is a property
Hello World!
</p>
);
}
}
- (Optional) link to Thinking in React early on and that coloured component hierarchy of the stock list.

Its not easy to think like a beginner once you are a pro. Hope this is an improvement suggestion and not a cause for confusion.
Beitragsleitfaden
Erste Schritte
- Lies das ganze Issue und danach den Beitragsleitfaden des Projekts.
- Schreib ins Issue, dass du es übernimmst — das erspart doppelte Arbeit.
- Forke das Repository und arbeite in einem Branch.
- Öffne einen Pull Request, der die Issue-Nummer nennt.
Rechercherichtung
Beginne mit dem Abschnitt Overview des verlinkten React-Tutorials und vergleiche ihn mit dem vorgeschlagenen Ablauf für Einsteiger. Als abgeschlossen gilt die Aufgabe, wenn der Überblick Komponenten, Lebenszyklus und Rendern in dieser Reihenfolge erklärt, das vorgeschlagene Hello World-Beispiel verwendet und optional auf Thinking in React verlinkt.
Vom Indexierungsmodell aus dem Issue-Text verfasst.
Bewertung
- Tech-Stack
- javascript, react
- Bereich
- documentation
- Issue-Typ
- Dokumentation
- Schwierigkeit
- 5/5
- Geschätzter Aufwand
- Über eine Woche
- Aktivitätsstatus
- Veraltet
- Klarheit
- Größtenteils klar
- Anfängerfreundlichkeit
- 30/100