Majikan menolak sebagian besar resume hanya dengan menjalankannya secara diagonal. Ini sedikit mengecewakan, bukan? Jadi, sangat penting baginya untuk segera melihat pengetahuan dan keterampilan yang dia butuhkan dari Anda. Sekarang adalah saat yang tepat untuk meningkatkan, terutama jika Anda tidak memiliki apa pun untuk dibanggakan di resume Anda. Anda tidak perlu pergi ke universitas untuk mempelajari keterampilan baru: Anda hanya perlu pergi ke arah yang benar dan tidak menyimpang darinya.
Jika Anda, misalnya, tahu caranya di ReactJS, ini akan memungkinkan Anda menjadi spesialis yang lebih banyak permintaan. Jika Anda seorang pengembang web pemula dan sudah mengetahui JavaScript dan HTML, ReactJS adalah langkah selanjutnya.
Pada artikel ini, saya akan membagikan daftar alat dan pustaka saya yang layak dipelajari untuk menjadi pengembang JavaScript yang baik dan menggunakan React.
Apa itu React dan mengapa itu layak dipelajari?
React adalah pustaka js untuk pengembangan antarmuka pengguna yang diluncurkan Facebook pada Mei 2013 (dan terus mendukung). Ini memungkinkan Anda untuk membuat antarmuka pengguna dinamis di JavaScript.
Karena React adalah salah satu library js paling kuat yang pernah ada, Anda dapat melakukan banyak hal baik dengan mempelajarinya. React digunakan oleh pengembang Amazon, PayPal, BBC, CNN, dan banyak raksasa teknologi lainnya. Selain itu, perpustakaan ini cukup fleksibel untuk memenuhi segala kebutuhan. Ini dapat digunakan bersama dengan tumpukan teknologi favorit Anda. React dapat digunakan untuk membuat dasbor data, aplikasi perpesanan, aplikasi jejaring sosial, aplikasi web satu halaman, dan blog pribadi, antara lain.
Mempelajari React saat mengerjakan proyek nyata tidak hanya akan membantu Anda belajar dengan cepat, tetapi juga akan memberi Anda kesempatan untuk pamer kepada calon pemberi kerja.
1.npm
Jelas bahwa alat ini tidak akan menjadi wahyu bagi siapa pun. Saya tidak bisa mengabaikannya.
Untuk bekerja dengan JavaScript (termasuk pustaka React), Anda perlu menginstal manajer paket Node ( npm ). Seperti pengelola paket yang disertakan dengan distribusi Linux Anda (atau Chocolatey untuk Windows atau Homebrew untuk macOS), npm menyediakan perintah untuk menanyakan repositori perangkat lunak dan menginstal paket yang diperlukan, termasuk komponen ReactJS.
Anda dapat menginstal Node.js (dan npm bersamanya) dari repositori distribusi Linux Anda.
Di Fedora atau Red Hat Enterprise Linux, lakukan hal berikut:
$ sudo dnf install nodejsDi Ubuntu atau Debian, ini sedikit berbeda:
$ sudo apt install nodejs npmJika distribusi Anda tidak menyertakan npm dalam repositori Anda, kunjungi Nodejs.org untuk mempelajari cara menginstal Node.js dan npm dalam kasus ini.
2. Mulai cepat
Create React App adalah proyek templat untuk membuat aplikasi React dengan cepat. Menyiapkan proyek yang berfungsi di React dulu merupakan tugas yang membosankan. Namun dengan fitur ini, Anda dapat menyiapkan pipeline build frontend, struktur project, lingkungan, dan pengoptimalan aplikasi untuk konfigurasi nol dalam hitungan detik. Anda bisa melakukannya dengan satu perintah. Selain itu, jika Anda memerlukan konfigurasi yang lebih kompleks, Anda dapat "mengekstrak" Buat Aplikasi React dan mengedit file konfigurasinya secara langsung.
Create React App adalah open source berlisensi di bawah lisensi MIT. Kode sumbernya ada di repositori GitHub.
Instalasi:
npm start
npm init react-app my-appJika Anda tidak ingin menggunakan Create React App, Anda dapat melihat ke React Boilerplate dan React Slingshot . Keduanya open source di bawah lisensi MIT.
3. React Sight
React Sight adalah alat visualisasi populer yang memungkinkan Anda menyajikan aplikasi Anda sebagai pohon hierarki komponen (seperti diagram alur). Itu dapat dihubungkan sebagai ekstensi Chrome (Anda masih perlu react devtools untuk menampilkan informasi tentang aplikasi Anda). Menggunakan antarmukanya, Anda dapat menambahkan filter untuk fokus pada komponen yang paling Anda butuhkan untuk berinteraksi. Mengarahkan kursor ke atas node, Anda akan melihat informasi tentang status saat ini dan props dari komponen tersebut. React Sight sangat berguna untuk men-debug proyek besar dan kompleks.
React Sight dirilis di bawah lisensi MIT, dan Anda dapat mengakses kode sumbernya di repositori GitHub. Anda dapat menggunakan toko web Chrome untuk menginstalnya .
4. Bereaksi Belle
React Belle adalah pustaka React kustom yang berisi komponen yang dapat digunakan kembali: Toggle, Rating, DatePicker, Button, Card, Select, dan banyak lagi. Ini dirancang untuk memberikan pengalaman pengguna yang nyaman. Komponen dioptimalkan untuk seluler dan desktop. Mereka sangat dapat disesuaikan dan mendukung Standar Aksesibilitas untuk Penyandang Disabilitas ( WAI-ARIA ). Perpustakaan mendukung berbagai tema seperti Belle dan Bootstrap.
Belle dirilis di bawah lisensi MIT, dan Anda dapat mengakses kode sumbernya di repositori GitHub.
Instalasi:
npm install belle5. Evergreen
Dibangun di atas primitif React UI, Evergreen adalah kerangka kerja UI yang berisi komponen berkualitas tinggi yang dapat Anda gunakan untuk membangun proyek Anda. Pengembang menyukai alat ini karena impor komponennya yang mudah.
Evergreen dirilis di bawah lisensi MIT, dan Anda dapat mengakses kode sumbernya di repositori GitHub.
Instalasi:
npm install --save evergreen-ui6. Sedikit
Bit adalah platform online dan alat baris perintah untuk menerbitkan dan berbagi aplikasi React. Ini adalah salah satu opsi terbaik jika Anda membuat dan berbagi komponen. Marketplace-nya adalah tempat orang dapat mempublikasikan aplikasi React mereka dan mencari komponen yang mereka butuhkan. Jadi Anda tidak perlu menemukan kembali roda setiap kali Anda membutuhkan aplikasi atau komponen React baru.
Sedikit:
- menyediakan penggunaan kembali kode;
- meningkatkan efisiensi desain dan pengembangan;
- menjaga konsistensi UI dan UX;
- meningkatkan stabilitas proyek.
Bit dirilis di bawah lisensi Apache 2.0, dan Anda dapat mengakses kode sumbernya di repositori GitHub.
Instalasi:
$ npm install bit-bin --global7. Buku Cerita
Buku cerita adalah alat untuk mengembangkan komponen UI dengan cepat. Ini memungkinkan Anda untuk melihat pustaka komponen dan melacak status masing-masing. Dengan StoryBook, Anda dapat mengembangkan komponen secara terpisah dari aplikasi Anda, sehingga lebih mudah untuk menggunakan kembali dan menguji komponen UI.
Terlebih lagi, API Buku Cerita menawarkan banyak fitur dan memudahkan penyesuaian. Perusahaan seperti Coursera, Squarespace dan Lonely Planet menggunakan alat ini.
Storybook dirilis di bawah lisensi MIT, dan Anda dapat mengakses kode sumbernya di repositori GitHub.
Pertama instal Storybook menggunakan perintah berikut:
$ cd my-react-app
$ npx -p @storybook/cli sb initSelanjutnya, jalankan perintah run:
$ npm run storybook8. Formik
Formik membantu Anda membuat dan memvalidasi formulir selama debugging, pengujian dan analisis. Ini memungkinkan Anda membuat formulir dinamis, jadi Anda tidak perlu mengubah atau memperbarui status dan alat peraga komponennya secara manual. Ini membuat pengembangan lebih cepat dan lebih menyenangkan.
Formik dirilis di bawah lisensi MIT, dan Anda dapat mengakses kode sumbernya di repositori GitHub.
Instalasi:
$ npm install formik --save9. Immer
Immer adalah pustaka js yang memungkinkan Anda mempertahankan kekekalan sekaligus meningkatkan kompleksitas struktur proyek. Lebih tepatnya, perpustakaan memudahkan untuk menjaga kode Anda tetap.
Beberapa fitur utama Immer adalah:
- Immer sangat diketik: ini berguna ketika objek status Anda berjenis.
- Immer menyusut boilerplate: Sebagian besar alat manajemen status mengharuskan Anda menulis banyak kode boilerplate. Immer memungkinkan Anda untuk menulis lebih sedikit kode.
- Immer memungkinkan Anda menggunakan struktur data JS: Anda dapat membuat status tetap di Immer menggunakan struktur data JS dasar.
Immer dirilis di bawah lisensi MIT, dan Anda dapat mengakses kode sumbernya di repositori GitHub.
Instalasi:
$ npm install immer10. Bereaksi Proto
React Proto adalah alat pembuatan prototipe aplikasi untuk pengembang dan desainer. Ini membantu Anda merencanakan struktur proyek Anda sehingga Anda dapat membuat keputusan sebelumnya. Oleh karena itu, Anda tidak membuang waktu untuk membuat perubahan selama pengembangan. Alat ini sangat membantu bagi orang yang lebih memilih desain daripada pengkodean: misalnya, Anda dapat menyeret dan melepas elemen daripada menulis kode untuk melakukannya. Alat ini akan membantu Anda menandai semua komponen yang dipilih dan memberi mereka nama, properti, dan hierarki.
React Proto dirilis di bawah lisensi MIT, dan Anda dapat mengakses kode sumbernya di repositori GitHub.
Untuk menginstalnya, pertama-tama buatlah fork repositori . Kemudian instal dependensi dengan:
$ npm installLalu lari:
$ npm start
$ npm run devSebuah langkah baru dalam karir Anda
Pada dasarnya, Anda dapat menemukan banyak JavaScript dan React sendiri. Tapi, untuk mempelajari lebih lanjut tentang alat yang saya sebutkan di artikel ini (dan banyak lagi), lihat repositori Awesome React GitHub.
Dengan mempelajari dan menerapkan alat-alat ini, Anda akan meningkatkan produktivitas dan membuat resume Anda lebih menarik bagi pemberi kerja.
Periklanan
Butuh server untuk aplikasi ReactJS Anda atau tujuan lain? Server epik kami dengan prosesor AMD modern dan kuat akan bekerja dengan baik. Berbagai macam konfigurasi dengan gaji harian.
