Perakitan pelat-reaksi baru- baru ini, pada tanggal 26 Juni
2018 , diperbarui ke versi 3.6.0. Perakitan ini sudah berusia lebih dari tiga tahun, tetapi, tampak menonjol dengan latar belakang banyak
orang lain (lebih dari 18 ribu Bintang GitHub), hampir tidak pernah terlihat di Habré. Apa fitur-fiturnya? Singkatnya - majelis menawarkan pengembang "sekaligus"!
Pertama tentang sedih
Pertama, sedikit tentang hal-hal yang menyedihkan. Nilai starter build untuk proyek reaksi sangat besar. Seperti yang Anda ketahui, React sendiri hanyalah perpustakaan yang mengimplementasikan level presentasi, dan untuk membuat aplikasi lengkap, Anda perlu menggunakan banyak perpustakaan lain, karena ekosistem React menawarkan banyak dari itu. Karena alasan ini, konfigurasi proyek Bereaksi merupakan masalah serius, solusinya sangat sulit ditemukan oleh pengembang perorangan. Dan Abramov sendiri sangat memahami hal ini, dengan menyatakan: "Konfigurasi seharusnya tidak menghalangi cara memulai ." Dan menawarkan solusi - Buat React App . Dalam perakitan awal ini, yang memperoleh popularitas besar (lebih dari 51 ribu Stars GitHub), penulis berusaha untuk melindungi pengembang dari masalah konfigurasi sebanyak mungkin, menyembunyikan konfigurasi default, memotong set modul ke minimum, memberikan kemungkinan pembuatan komponen otomatis, sehingga menciptakan rasa kesederhanaan dan kemudahan pengembangan aplikasi bereaksi. Selain itu, mereka, berdasarkan pesan yang sama, menawarkan daftar kebaktian yang direkomendasikan. Pendekatan ini mungkin baik untuk menarik pendatang baru, tetapi dengan cepat melelahkan diri dengan keterbatasan dan masalah konfigurasi, masalah penerapan modul terbaik, praktik terbaik masih perlu ditangani. Dan bagaimana dengan , misalnya, seorang pengembang yang mengembangkan proyek reaksi pertamanya?
Ada jalan keluar
Perakitan pelat-reaksi merupakan pendekatan alternatif untuk menyelesaikan masalah dan menawarkan "sekaligus." Ini adalah satu set modul yang diakui sebagai standar de facto dan diuji dalam pekerjaan, satu set di mana praktik terbaik dalam organisasi proyek diterapkan, termasuk dengan mempertimbangkan skalabilitas dan kinerja, teknologi diperkenalkan yang membantu programmer untuk dengan cepat mengembangkan dan men-debug kode.
Pengembang perakitan memposisikannya sebagai "offline-first" yang sangat skalabel (setelah aplikasi yang diunduh bekerja secara offline), dengan mempertimbangkan pengalaman pengembang terbaik, yang ditujukan untuk kinerja tinggi dan dibangun sesuai dengan "praktik terbaik", kuat, "siap produksi", fondasi yang telah teruji untuk mengembangkan aplikasi reaksi.
Perpustakaan yang Berlaku
Informasi lebih lanjut tentang modul yang digunakan:
- React, v16.4 (Fiber) - implementasi progresif dari algoritma React kunci yang meningkatkan produktivitas dalam pengembangan tugas seperti animasi, pengorganisasian elemen pada halaman dan pergerakan elemen;
- React Router , v4.3 - router de facto untuk bereaksi aplikasi, memungkinkan untuk membangun aplikasi dengan URL ramah mesin pencari;
- Redux , v4 - perpustakaan yang menyediakan aliran data yang benar-benar searah, membuat logika aplikasi lebih mudah diprediksi dan lebih mudah dipahami;
- Redux Saga , v0.16 - perpustakaan yang dirancang untuk menyederhanakan dan meningkatkan pelaksanaan efek samping (mis., Tindakan seperti operasi asinkron seperti memuat data, dll.) Di aplikasi React / Redux;
- Pilih kembali , v3 - perpustakaan yang memungkinkan Anda untuk mencegah penggambaran ulang dan penghitungan ulang data yang diterima, yang, pada gilirannya, mempercepat aplikasi React / Redux;
- ImmutableJS , v4 - perpustakaan yang memfasilitasi bekerja dengan data yang tidak dapat diubah dalam aplikasi React / Redux;
- Styled Components , v3.3 - pustaka yang memungkinkan Anda untuk menyingkirkan kelas CSS sebagai tahap perantara antara komponen dan gayanya;
- React Loadable, v5.4 - perpustakaan yang memungkinkan Anda untuk menerapkan pendekatan berorientasi komponen untuk pemisahan kode dan mengimplementasikan pemuatan yang terlambat;
- Jest v23.1, Enzyme v3.3 - perpustakaan untuk menguji aplikasi reaksi.
Skalabilitas dan kinerja
Majelis secara konsisten menerapkan prinsip-prinsip dukungan untuk skalabilitas dan peningkatan produktivitas, dirinci oleh pengembang perakitan Max Stoiber dalam kuliahnya "Scaling ReactJS Applications" dan Dan Abramov dalam kuliah "Komponen presentasi dan komponen wadah" .
Secara khusus, prinsip-prinsip ini meliputi:
- pemisahan komponen menjadi presentasi dan wadah;
- penempatan kode sesuai dengan prinsip satu komponen - satu folder;
- penggunaan alat modern (komponen-gaya, Modul CSS) untuk menyelesaikan masalah pewarisan CSS dalam proyek besar;
- Aplikasi Redux / Saga untuk menyederhanakan aliran data, menyederhanakan operasi asinkron.
Pengkodean, debugging, pengujian
Majelis memberikan banyak peluang untuk membantu programmer dalam menulis dan men-debug kode:
- JavaScript generasi berikutnya (template huruf kecil, restrukturisasi objek, sintaksis JSX, dll.);
- pembuatan komponen / wadah / rute yang cepat dengan penyeleksi, kisah, pereduksi, dan pengujian melalui baris perintah;
- “Penukaran panas” dari modul, memungkinkan tanpa penundaan untuk melihat hasil perubahan yang dilakukan pada kode aplikasi;
- penggunaan Plugin Webpack Dll , yang meningkatkan waktu startup aplikasi pada server sebesar 40% dan selama "hot restart" dari modul;
- menggunakan AppVeyor dan TravisCI (file instalasi disertakan secara default), yang memungkinkan Anda untuk secara otomatis menjalankan tes aplikasi pada Windows dan Unix;
- analisis kode statis: ESLint , Prettier dan stylelint secara otomatis memeriksa dan memformat kode di editor Anda (diperlukan konfigurasi , file konfigurasi , dan instruksi dilampirkan);
- penempatan pada layanan cloud Heroku , AWS S3 : (diperlukan konfigurasi, termasuk instruksi ).
Baris perintah
Majelis menyediakan, sebagaimana telah disebutkan, satu set perintah untuk baris perintah, di mana banyak fitur yang diperlukan untuk pengembang diimplementasikan, termasuk:
- inisialisasi proyek baru dengan cakupan uji 100%;
- meluncurkan aplikasi di server pengembang;
- pembuatan komponen, wadah dengan penyeleksi, kisah-kisah, reduksi dan pengujian mereka;
- pembuatan versi "produksi" dari kode proyek;
- pengujian proyek;
- debug jarak jauh, yang memungkinkan menggunakan layanan Ngrok untuk menyediakan akses aman ke server lokal dari Internet;
- linting;
- manajemen terjemahan (menambahkan bahasa, mengekstraksi pesan ke file JSON i18n);
- profiling, meskipun disebutkan di antara kelebihan dari build command line, sayangnya tidak ditemukan.
Apakah ada yang berlebihan?
Jika Anda memutuskan bahwa Anda tidak memerlukan beberapa modul, Anda dapat menghapusnya dan perakitan akan membantu Anda dengan instruksi Anda (di sini dan di sini ).
Apakah Anda pikir ada sesuatu yang hilang?
Fitur tambahan yang disediakan oleh majelis:
- "Offline-first", yang berarti bahwa begitu aplikasi yang diunduh berfungsi offline, bahkan pada browser lama;
- "Aplikasi web asli", berarti setelah kunjungan berulang ke aplikasi, pengguna akan menerima undangan untuk menambahkan ikon ke layar beranda dan aplikasi dapat digunakan persis sebagai aplikasi "asli" (tetapi tanpa batasan yang diberlakukan oleh toko aplikasi);
- dukungan untuk optimisasi mesin pencari (manajemen tag kepala halaman) untuk mesin pencari yang mendukung pengindeksan konten JavaScript;
- Pemuatan cepat Font Web, yang menghilangkan penundaan tampilan halaman yang terkait dengan penundaan pemuatan font;
- optimisasi gambar melalui pemuat gambar Webpack.
Dokumentasi
Majelis didokumentasikan dengan baik, dan, misalnya, bahkan berisi bagian tentang pemecahan masalah yang mungkin terjadi .
Pembaruan, Bug
Proyek ini diperbarui secara berkala, segera menanggapi perubahan dalam modul penyusunnya (terakhir diperbarui 06/26/2018), aktif memecahkan masalah : misalnya, pada 11/08/2018, 1367 diselesaikan dan 9 masalah sedang dalam proses penyelesaian.
Jadi apa
Jadi, majelis memberikan contoh yang sangat baik dari konfigurasi penuh dari proyek Bereaksi, menciptakan kondisi bagi programmer untuk mempercepat penulisan dan debugging kode, menawarkan contoh penerapan praktik terbaik yang digunakan dalam pengembangan aplikasi yang sangat skalabel dan produktif.
Dan akhirnya - pesan dari penulis majelis Maximilian Stoiber dan timnya:
"Jika Anda membutuhkan fondasi yang kuat dan teruji untuk membangun makanan super Anda berikutnya, dan Anda memiliki pengalaman dengan React, ini sempurna untuk Anda!"