Сайн тайлбартай программын код бичих бол программ зохиох соёлоос гадна кодыг ойлгомжтой болгох үндсэн арга. Иймд та программчлалын хэлийг үзэж эхлэх үеэсээ тайлбарыг ашиглаж сурахыг хичээгээрэй. Эхлэн суралцаж байхад том хэмжээний код бараг бичдэггүй болохоор тайлбарыг нэг их анзаардаггүйгээс болоод кодод тайлбар хийхгүй бичээд сурах гээд байх муу талтай. Энэ бол маш буруу барил гэдгийг танд сануулъя. Та том хэмжээний ажил гүйцэтгэх үедээ голдуу багаар ажиллах тул таны кодыг бусад хамтран ажиллагсад ойлгох шаардлага гарч болохыг санах хэрэгтэй. Том хэмжээний кодод тайлбар хийхгүй бол хэсэг хугацааны дараа та өөрөө ч ойлгохгүй байдал үүсч болохыг сануулъя. За ингээд хичээлээ эхлэе.

Хичээлээр react компонентийн элементүүдийн хэвжүүлэлтэд хэрэг болох нэгэн аргачлалыг авч үзье. Тухайлбал элементийг inline -аар хэвжүүлэлтийн үед ашиглах техник юм. Иймээс Car компонентийн хэвжүүлэлтийн Car.css файлаас

.Car {
  margin-bottom: 10px;
  display: block;
  padding: 10px;
  border-radius: 5px;
}

border, box-shadow хэвүүдийг хасан тэдгээрийг Car компонентод inline -аар хэвжүүлэлтээр

  const style = {
    border: '1px solid #ccc',
    boxShadow: '0 4px 5px 0 rgba(0, 0, 0, .14)'
  }
  return (
    <div className="Car" style={style}>
      <h3>Машиний нэр: {props.name}</h3>
      <p>Он: <strong>{props.year}</strong></p>
      <input
        type="text"
        onChange={props.onChangeName}
        value={props.name}
        className={inputClasses.join(' ')}
      />
      <button onClick={props.onDelete}>Устгах</button>
    </div>
  )

style хувьсагчид тодорхойлоод Car компонентийг багцалж буй div -ийн style атрибутад дамжуулах болгон өөрчилье.

Програмчлалыг реактив /reactive/ аргачлалаар боловсруулахад зориулагдсан Javascript дээр бичигдсэн Rxjs санг өөрийн програмдаа ашиглахын тулд түүнийг компьютертоо хэрхэн суулгахыг RxJs санг суулгах хичээлд хийсэн. Сан хэрхэн ажилладагийг харахын тулд index.js файлд сангийн хамгийн энгийн боломжийг үзүүлэх

var stream$ = Rx.Observable.create(function (observer) {
    observer.next('нэг');
});

кодыг оруулан өгье. Дээрх код stream буюу урсгал үүсгэж байгаа. RxJs санд стрим нь ердийн хувьсагч. JavaScript -д стрим мэтийн синхрон төрлийн хувьсагчийн нэрийн ард $ тэмдэг тавьдаг дүрэмтэй. Кодод стрим төрлийн stream$ хувьсагчид RxJs сангийн Observable классын create аргаар стрим үүсгэн олгосон байгаа.

Сангийн албан ёсны сайтын нүүр хуудас дахь Get Started товчоор шилжилт хийвэл React -ийн материалууд /Docs/ хэсэгт шилжинэ.

Getting Started хэсэгт React -ийг ажиллуулах аргуудын мэдээлэл бий. Жишээ нь CodePen, CodeSandbox гэх мэт онлайн сервисүүд дээр турших, веб сайтад санг нэмэх, React app үүсгэх гэх мэтээр.