Hello World

Най-малкият пример на React изглежда така:

ReactDOM.render(
  <h1>Hello, world!</h1>,
  document.getElementById('root')
);

Показва заглавие с надпис “Hello, world!” на страницата.

Опитайте примера в CodePen

Кликнете върху връзката по-горе, за да отворите онлайн редактор. Чувствайте се свободни да направите някои промени и да видите как те влияят на резултата. Повечето страници в това ръководство ще могат да се редактират по този начин.

Как да прочетете това ръководство

В това ръководство ще разгледаме градивните блокове на приложения с React: елементи и компоненти. След като ги овладеете, можете да създавате сложни приложения от малки преизползваеми парчета.

Съвет

Това ръководство е предназначено за хора, които предпочитат да учат концепциите стъпка по стъпка. Ако предпочитате да се учите чрез практика, вижте нашия практически урок. Можете да откриете, че това ръководство и урокът се допълват взаимно.

Това е първата глава в ръководство за основните концепции на React. Можете да намерите списък с всички глави в навигационната странична лента. Ако четете това от мобилно устройство, можете да влезете в навигацията, като натиснете бутона в долния десен ъгъл на екрана.

Всяка глава в това ръководство надгражда върху знанията, въведени в предишните глави. Можете да научите по-голямата част от React, като прочетете главите с “Основни концепции” в реда, в който се появяват в страничната лента. Например, “Представяне на JSX” е следващата глава след тази.

Предположения за ниво на знанието

React е JavaScript библиотека и затова ще приемем, че имате основни знания в езика JavaScript. Ако не се чувствате много уверени, ние препоръчваме да преминете през JavaScript урок, за да проверите нивото на знанията си и за да можете да следвате това ръководство без проблем. Може да ви отнеме между 30 минути и един час, но в резултат на това няма да се налага да се чувствате все едно учите и React, и JavaScript по едно и също време.

Забележка

Това ръководство понякога използва по-новия JavaScript syntax в примерите. Ако не сте работили с JavaScript през последните няколко години, тези три точки ще ви помогнат значително.

Да започваме!

Продължете да се придвижвате надолу и ще намерите връзката към следващата глава от това ръководство точно преди последната част на сайта.