Menginstal React.js di Mac

Diterbitkan: 2022-04-29

Perangkat lunak ini adalah pustaka JavaScript front-end sumber terbuka dan gratis. Pada tahun 2013, React.JS didirikan oleh Facebook.

Ini adalah perpustakaan Antarmuka Pengguna (UI) yang digunakan untuk membuat dan memanipulasi komponen UI. Ini adalah paket yang memungkinkan pengembang untuk membuat aplikasi SPA berbasis data yang sangat efisien.

Hal ini didasarkan pada pemrograman fungsional, bergantung pada konsep kekekalan, dan mempromosikan arsitektur berbasis komponen berdasarkan prinsip penggunaan kembali tunggal.

Pada artikel ini, kita akan membahas prosedur cara menginstal react di mac. Setelah Anda menyelesaikan tahapan instalasi, kami mendorong Anda untuk menghadiri pelatihan React online.

Mari kita jelajahi beberapa istilah sebelum-

Isi

  • 1 NodeJS dan NPM
  • 2 Menginstal ReactJS di MacOS
  • 3 Buat proyek ReactJS
  • 4 React- Pendahuluan
  • 5 Node.js & npm
  • 6 Singkatnya

NodeJS dan NPM

  • Anda harus menginstal NodeJS dan NPM terlebih dahulu untuk mendapatkan instalasi React di Mac.
  • Ini adalah mesin JavaScript yang memungkinkan Anda untuk menjalankannya di luar browser.
  • NPM (manajer paket node) digunakan pada baris perintah. Ini untuk menginstal perpustakaan seperti ReactJS.
  • Anda dapat menginstal NodeJS melalui situs resmi mereka. Saat Anda menginstal NodeJS, itu juga akan mengunduh NPM untuk Anda.
  • Setelah mengunduh NodeJS dari situs web mereka, temukan file “.pkg”. Cukup klik dua kali pada ini. Ini akan meluncurkan pop-up untuk instalasi.
  • Anda akan diarahkan ke proses instalasi. Klik "Instal," atau "Ubah Lokasi Pemasangan"
  • Ketika proses selesai, Anda akan diminta dengan pesan terakhir. NodeJS dan NPM Anda diinstal.

Menginstal ReactJS di MacOS

Setelah menginstal NodeJS dan NPM, seseorang dapat menginstal ReactJS. Ini dilakukan dengan menjalankan npm install- save react react-dom.

Buat proyek ReactJS

Karena kami telah menginstal ReactJS, seseorang dapat membuat direktori proyek reaksi baru. Ini dilakukan dengan menjalankan npx create react project. buat-reaksi-aplikasi.

React- Pendahuluan

Sebelum melanjutkan dengan instalasi React-Lib ke Mac, pertama-tama kita harus mendapatkan pemahaman dasar tentang React.

  • React adalah paket yang membantu pengembang web dan arsitek dalam memenuhi harapan pelanggan yang membutuhkan aliran data tinggi dan UI responsif yang cepat dalam konteks data.
  • Itu dibangun di atas arsitektur berbasis komponen. Halaman web dapat diwakili oleh komponen Induk dan Anak.
  • Ini sebagian besar bergantung pada Virtual DOM, yang berfungsi sebagai pengoptimal kinerja untuk operasi DOM.
  • Halaman web HTML memiliki pohon DOM, yang digunakan browser untuk merender halaman web.

Ketika pengguna berinteraksi dengan halaman, itu memerlukan penambahan dan penyisipan informasi berdasarkan tindakan pengguna. seperti pada Seorang pengguna telah menambahkan item ke keranjang. Keranjang sekarang menampilkan item yang diubah sebagai hasil dari keputusan pengguna.

Di balik layar, dokumen HTML mengalami transformasi yang memungkinkan halaman yang dimodifikasi untuk dibagikan.

Seperti yang dinyatakan sebelumnya, pohon DOM mewakili dokumen HTML. Dalam kasus sebelumnya, DOM memerlukan beberapa penyesuaian, yang mencakup penyisipan dan penghapusan node HTML tertentu.

Ini membantu dalam menampilkan informasi penting yang melambangkan apa yang coba dilakukan pengguna dalam konteks merevisinya

keputusan pembelian.

Kita mungkin melihat DOM sebagai pohon untuk lebih memahaminya.

Pohon itu memiliki akar dan juga cabang. Demikian pula, elemen HTML berada di bagian atas DOM, dan simpul di bawahnya terhubung ke simpul induk. Dalam analogi pohon, simpul induk dapat direpresentasikan sebagai batang, dengan simpul lain yang terhubung ke batang. Dan React digunakan untuk meningkatkan operasi penyisipan dan penghapusan pada node ini.

Ada penalti memori yang terkait dengan operasi penyisipan dan penghapusan ini pada DOM HTML. Dalam hal operasi pembaruan DOM, DOM virtual berfungsi sebagai pengoptimal kinerja.

Itu menyimpan dua salinan: salah satu DOM asli (react DOM) dan salah satu pembaruan yang akan dibuat. Proses meminimalkan modifikasi pada react DOM juga diteliti sebagai bagian dari proses rekonsiliasi.

Node.js & npm

Node.js mengeksekusi kode JavaScript. Ini adalah open-source dan lintas platform untuk lingkungan runtime JavaScript. Ini didukung oleh mesin Chrome V8. Mesin Chrome V8 ditulis dalam C++. Node kompatibel dengan Windows, Mac, dan Linux.

Setelah menginstal Node.js, kami dapat menjalankan aplikasi berbasis React secara lokal di sistem kami selama pengembangan. Ini juga memungkinkan kami untuk menyebarkan program kami ke server produksi.

Node.js mencakup fitur-fitur berikut:

  • Menggunakan JavaScript sebagai bahasa intinya
  • I/O tanpa pemblokiran
  • Mendukung pemrograman Asinkron
  • Dapat mengelola banyak permintaan koneksi menggunakan satu server.

Npmjs.org adalah repositori kode online dari ribuan modul (npm) yang memungkinkan kita untuk menginstal modul node menggunakan perintah sederhana.

Beberapa modul mandiri, sedangkan yang lain memerlukan saling ketergantungan untuk berfungsi dengan baik.Node.js memungkinkan kita untuk melakukan operasi baca dan tulis di server. Hal ini juga memungkinkan Anda untuk bekerja dengan database.

Alih-alih membuat fungsionalitas dari awal, kita dapat mencari modul dan menggunakan kembali serta memperluas fungsinya.

Inisiatif pengembang biasanya melibatkan kendala waktu dan anggaran. Ketika datang ke Node. pengembangan berbasis js, npmjs.org adalah jalur kehidupan bagi komunitas pengembang.

Untuk menyimpulkan

Dalam tutorial ini, kita belajar tentang React.js dan pendekatan arsitektur berbasis komponen di React.js. Kami juga mendapatkan ikhtisar tingkat tinggi tentang DOM virtual.

Kami membahas konsep rekonsiliasi, penggunaan Node.js di dunia JavaScript, dan kapasitasnya untuk mengelola output I/O non-blocking untuk memenuhi permintaan koneksi klien secara bersamaan.

Kami menguji dua teknik untuk menginstal Node.js: satu dengan manajemen paket dan satu lagi dengan baris perintah.

Untuk memulai dengan cepat menggunakan React.js, kami menggunakan modul create-react-app. Kami juga dapat menggunakan baris perintah untuk menginstal React.js.

Untuk menghindari kelebihan beban dengan terlalu banyak detail, kami menggunakan teknik create-react-app untuk tutorial ini. Kami melihat aplikasi reaksi pertama kami berjalan setelah mengembangkannya. Kami dengan cepat mengevaluasi file penting yang mengoperasikan aplikasi agar terbiasa dengan kode dari sudut pandang pengembangan.

Baca Juga:

  • Virus Mac Masih Hidup Bunuh mereka dan Tinggal dalam Ketenangan!