Get best of the week

ReactJS: mulai cepat

Kursus pengembang React.js akan segera dimulai , jadi pelajaran terbuka lainnya diadakan di dalam dinding OTUS. Masalah-masalah berikut dipertimbangkan di dalamnya:

  • Apa yang termasuk dalam rangkaian fitur React.js standar;
  • apakah mungkin untuk membangun aplikasi yang kompleks dengan ini;
  • komposisi terhadap warisan;
  • pemrograman fungsional - mudah atau sulit?
  • apa itu Redux dan mengapa itu diperlukan.



Di akhir pelajaran, kami mengembangkan aplikasi web ReactJS kecil. Webinar ini diselenggarakan oleh Nikita Ovchinnikov , seorang insinyur perangkat lunak dengan lebih dari 8 tahun pengalaman pengembangan komersial.

Apa itu Bereaksi?


Anda akan melihat jawaban untuk pertanyaan ini dengan membuka situs web resmi, di mana ada tertulis bahwa React adalah perpustakaan JavaScript untuk membangun antarmuka pengguna.



Di sini Anda akan menemukan tutorial yang luar biasa, setelah mempelajari yang mana, Anda dapat menggunakan kerangka kerja ini segera setelah membacanya. Jika Anda ingin, lihat tutorial dalam bahasa Rusia, tetapi ini tidak dianjurkan. Jika benar-benar buruk dengan bahasa Inggris, tetap buka versi bahasa Inggris asli dan gunakan penerjemah Google. Faktanya adalah bahwa sumber-sumber resmi berbahasa Rusia kadang-kadang tertinggal dalam hal terjemahan (kebetulan bahwa dokumentasi diperbarui, tetapi terjemahannya belum).

Mengapa Bereaksi begitu populer?


Misalnya, statistik selama 6 bulan terakhir , tidak termasuk penurunan karakteristik selama liburan musim dingin , bersaksi tentang popularitas React : Statistik berikut



juga menunjukkan hasil yang baik : Tentu saja, statistik jauh dari segalanya, tetapi tetap saja kita dapat melihat dari sampel bahwa popularitas tinggi, dan itu hanya meningkat. Mengapa Bereaksi begitu populer? Ada sejumlah alasan untuk ini:







  • itu didokumentasikan dengan sangat baik :
    - di sini adalah tutorial ;
    - di sini adalah panduan untuk pemula .
    Namun, hari ini kerangka tersebut tidak akan menjadi populer jika didokumentasikan dengan buruk;
  • React . , . ;
  • , — . JSX, , ;
  • . - , , , , , , , ;
  • . . , , , . React Angular;
  • (react-developer-tools, redux-dev-tools);
  • React , , .

React?


Jadi, berkenalan - kelemahan # 1: Bereaksi tidak mudah dipelajari . Dan inilah alasannya:

1. Bereaksi adalah cara berpikir yang sangat berbeda. Jika Anda bekerja dengannya, Anda benar-benar perlu membangun kembali. Dalam Bereaksi, tidak seperti kerangka kerja lain, hanya ada konsep komposisi. Orang-orang dari Facebook mendesain kerangka kerja mereka sedemikian rupa sehingga tidak memiliki warisan . Dan orang-orang yang sama dari Facebook ini secara logis menjelaskan keadaan ini :

"Di Facebook, kami menggunakan Bereaksi dalam ribuan komponen, dan kami belum menemukan kasus penggunaan di mana kami akan merekomendasikan membuat hierarki warisan komponen . "

Kenyataannya, pernyataan ini tidak berdasar, karena dalam OOP, tentu saja ada banyak masalah terkenal, misalnya, jumlah abstraksi yang berlebihan. Selain itu, tidak semua pengembang adalah pendukung untuk membangun rantai warisan yang luar biasa dan ini semua, meskipun, tentu saja, di suatu tempat warisan diperlukan dan bermanfaat.

2. Poin kedua yang mempersulit studi React adalah bahwa ia hanya berisi rekomendasi dan tidak ada aturan yang kaku. Tidak hanya itu, sambil mempelajari kerangka kerja itu masih bisa diterima, tetapi ketika Anda sampai pada proyek nyata, Anda akan sangat terkejut. Faktanya adalah bahwa tidak ada dua proyek yang identik di React, dan di setiap perusahaan proyek dengan React sepenuhnya bersifat individu. Anda terbiasa dengan satu situasi, dan kemudian beralih ke tim lain dan melihat bahwa semuanya berbeda di sana: perpustakaan lain, aturan lain ... Dan lagi, Anda perlu beradaptasi dan beradaptasi. Seperti yang mereka katakan, Anda harus membayar untuk fleksibilitas.

3. Kesulitan belajar ketiga - untuk berhasil menguasai React, pengembang harus memiliki level tinggi. Tidak, Bereaksi sendiri sederhana dan mudah ditulis. Tetapi untuk melakukan sesuatu yang kurang lebih rumit, Anda harus memiliki keterampilan pemrograman yang baik. Jika ada kesenjangan dalam pengetahuan mendasar tentang JS dan TS, itu akan sangat sulit bagi Anda, dan Anda tidak akan mengerti segalanya.

Masalah pilihan


Sekarang mari kita bicara tentang kelemahan nomor 2 - masalah pilihan . Ini adalah variasi di mana mudah tersesat. Sebenarnya ada banyak hal. Hook baru-baru ini muncul - percakapan telah dimulai tentang fakta bahwa kelas tidak lagi diperlukan, pertempuran React Hooks vs React Class telah dimulai ... Semua orang bergegas untuk menggunakan kait, dan kemudian mereka mengatakan bahwa semuanya tidak jelas dan kembali menggunakan kelas, dll., Dll.

Sebenarnya ... jawaban yang benar untuk pertanyaan " React Hooks atau React Class " tidak ada. Atau, lebih tepatnya, jawaban yang benar tergantung pada kondisi di mana Anda mengajukan pertanyaan ini.

Pertanyaan lain muncul: "Bagaimana cara memeriksa jenis"? Lihat yang kita miliki:


Dan di sini kita memiliki lagi masalah pilihan, yang, jujur ​​saja, kadang meresahkan. Tentu saja, semuanya sangat bervariasi, dan dalam proses bekerja dengan beberapa keputusan Anda akan bertemu, tetapi Anda tidak akan pernah "melihat" beberapa. Semua tergantung pada situasinya.

Sekali lagi, ada Buat React App , Webpack.js dan Babel , jadi begitu Anda memulai, Anda akan memiliki pertanyaan di sini, apa yang harus digunakan?

Penderitaan pilihan berikut dikaitkan dengan Negara . Ada Redux dan ada MobX , dan di dalam Redux ada juga redux-saga dan redux-thunk . Dan sulit, tanpa berusaha, untuk menyadari apa yang lebih baik untuk digunakan dalam situasi tertentu.

Selain:

1. Router . Ada sekitar lima, berikut ini yang paling populer:


2. CSS-IN-JS . Dalam kerangka pendekatan yang sangat baik ini, omong-omong, ada juga pilihan:


Untuk meringkas, Anda dapat daftar Kontra Bereaksi berikut :

  1. Ambang entri tinggi. Tanpa kepura-puraan, katakanlah sulit untuk belajar Bereaksi. Termasuk karena infrastrukturnya yang sangat besar.
  2. Banyak waktu untuk belajar. Setelah itu tidak mudah dipelajari, bersiaplah untuk meluangkan waktu untuk itu - jika tidak, tidak mungkin. Anda harus mengerti apa itu.
  3. Variasi yang sangat besar sehingga mudah tersesat. Tidak ada yang ditambahkan.

Apa artinya "banyak waktu belajar"? Bahkan, jika Anda mengambil teknologi apa pun, tidak peduli seberapa lembutnya Anda ditata dari sudut pandang pemasaran, jangan percaya kata-kata dengan gaya "Anda akan belajar hanya dalam dua pelajaran singkat" - ini semua omong kosong, dan tidak bekerja di dunia nyata . Basi, tetapi benar: untuk menjadi spesialis yang benar-benar baik, Anda harus menghabiskan banyak waktu. Dan untuk mulai melakukan sesuatu, banyak waktu tidak diperlukan.

Apa kekuatannya, saudara?


Terlepas dari semua hal di atas, React adalah teknologi yang sangat kuat. Pertama, jika Anda seorang profesional, pekerjaan akan sangat mudah ditemukan. Sebaliknya, akan sulit untuk menolaknya, karena ada begitu banyak penawaran di pasaran:



Nilai tambah berikutnya adalah banyak perpustakaan dan solusi yang sudah jadi. Ini ditunjukkan oleh tangkapan layar yang sama dari GitHub (ada lebih dari satu juta repositori):



Jika Anda hanya berpikir bahwa akan lebih baik untuk "hancurkan benda ini", ternyata itu sudah dibuat oleh seseorang. Teknologi ini sangat populer.

Selain:

  1. Keragaman adalah masalah bagi pemula, tetapi bagi seorang profesional itu adalah nilai tambah!
  2. Bereaksi berisi sejumlah besar solusi bagus.
  3. Anda dapat mengembangkan aplikasi dengan kompleksitas apa pun.
  4. Anda dapat menulis dengan gaya apa pun.

Dukungan naskah


Bereaksi hanya memiliki dukungan hebat untuk skrip. Bahasa ini bagus jika hanya karena dapat digunakan untuk menulis jenis yang benar-benar berfungsi dan sangat membantu. Dan dengan TypeScript Anda dapat menulis sistem tipe yang sangat kuat. Pada dasarnya, naskah sekarang menjadi standar, dan standar ini dalam Bereaksi. Tentu saja, Anda tidak dapat menggunakannya, lebih memilih JavaScript. Namun, tanpa naskah, sangat sulit untuk melakukan sesuatu yang sulit secara wajar, karena tanpa jenis yang ketat sangat sulit untuk bekerja. Sulit juga untuk memprediksi bagaimana keputusan Anda akan berperilaku tanpa tipe yang ketat. Ini sulit dilakukan walaupun dengan tipe, dan tanpa itu sangat menyedihkan ...

Secara umum, pastikan untuk bekerja dengan Typecript, karena ini adalah teknologi yang sangat diperlukan:

- https://www.typescriptlang.org/docs/handbook/react-&- webpack.html.



Beberapa tips


Akhirnya, saya ingin memberikan beberapa rekomendasi. Hari ini mereka banyak berbicara tentang OOP, dan Anda dapat dengan mudah menemukan sejumlah besar informasi tentang topik ini. Dan di mana-mana Anda akan ditulis untuk yang kesekian kalinya tentang hewan kelas dasar, dan darinya - tentang Kucing dan Anjing. Atau tentang Mobil kelas dasar, dan dari sana - Ferrari dan BMW. Dan ini semua yang akan mereka tunjukkan dari waktu ke waktu dan dari satu buku ke buku teks lainnya, sementara tingkat pengembang Anda akan tumbuh pada waktu yang sama dengan siput.

Pada saat yang sama, jelas tidak cukup perhatian diberikan pada pemrograman fungsional, pemahaman yang benar-benar akan memompa keterampilan Anda. Jika Anda benar-benar belajar menggunakannya dengan benar dan benar. Salah satu buku yang paling memadai hingga saat ini tersedia secara bebas di sini dan sangat disarankan untuk dibaca:



Mengapa sulit mempelajari pemrograman fungsional? Karena sangat sering buku-buku dipenuhi dengan matematika, kompleksitas akademik, dll. Setelah buku yang sama, Anda akan berhasil, karena itu hanya luar biasa.

Mengapa pemrograman fungsional itu penting? Karena, hal seperti Redux dibangun di atas dasar dasar pemrograman fungsional. Dan setelah menguasai setidaknya pemrograman fungsional dasar, Anda benar-benar akan mulai menulis kode lebih baik. Hal utama adalah memahami semuanya dengan benar.

Poin kedua yang ingin saya bicarakan adalah arsitektur. Arsitektur kami adalah segalanya ! Ada paradigma arsitektur yang sangat bagus yang disebut bebek. Ini tentang bagaimana membangun aplikasi React dan Redux. Arsitektur ini layak direkomendasikan untuk penggunaan praktis.

Idenya sendiri sangat menarik dan mewakili seperangkat aturan yang ketat dan sekaligus keren yang akan membuat struktur keputusan Anda mudah dipahami dan dibaca. Ini bukan longrid, jadi cukup untuk membaca dan memahami isinya sekali. Setelah itu, Anda akan dapat mengatur aplikasi dengan benar. Tautan terlampir.



Total


  1. Siapa pun yang mengatakan sesuatu, Bereaksi memiliki ambang masuk yang tinggi. Bahkan dengan beberapa tahun pengalaman pemrograman JavaScript, bersiaplah untuk apa yang akan sulit dan banyak pertanyaan akan muncul.
  2. Bereaksi memberikan peluang yang sangat besar. Tapi sudah banyak yang dikatakan tentang pro, jadi kami tidak akan mengulangi lagi.
  3. Jika Anda tertarik pada sejarah pengembangan Bereaksi, inilah Peta Jalan yang baik .

Itu saja. Jika Anda tertarik pada bagian praktis dari pelajaran ini, saksikan webinar mulai sekarang . Aplikasi web uji kecil akan dikembangkan di ReactJS, kode yang tersedia di GitHub .

More articles:


All Articles