Pembaca seperti Anda membantu mendukung MUO. Saat Anda melakukan pembelian menggunakan tautan di situs kami, kami dapat memperoleh komisi afiliasi.

Angular adalah framework JavaScript yang kuat untuk membangun aplikasi satu halaman. Google mengembangkan perangkat lunak dan memeliharanya bersama dengan kontributor di seluruh dunia.

Seperti React, Anda dapat menggunakan Angular untuk membuat berbagai aplikasi front-end, termasuk sistem web, seluler, dan desktop. Beberapa industri lebih memilih Angular karena komprehensif dan stabil.

Mari pelajari lebih lanjut tentang Angular dengan menggandakan proyek dari GitHub dan menjalankannya secara lokal.

Prasyarat untuk Kloning

Tidak seperti kerangka kerja lain, mengkloning dan menjalankan aplikasi Angular sangatlah mudah. Anda akan menggandakan proyek GitHub. Sebelum memulai, pastikan Anda memenuhi persyaratan berikut:

  • Anda harus menginstal Node.js versi stabil. Jika tidak, pelajari cara menginstal Nodejs di Ubuntu atau instal Nodejs di Windows.
  • Anda harus telah menginstal Git.
  • Anda harus memiliki akun GitHub.
instagram viewer

1. Instal Manajer Paket Node

Manajer Paket Node (npm) adalah repositori perangkat lunak untuk paket JavaScript. npm memiliki CLI (Command Line Interface) yang melakukan berbagai tugas. Anda dapat menggunakan CLI untuk mengunduh, menginstal, dan menerapkan perangkat lunak.

Saat Anda menginstal Node.js, ia hadir dengan paket npm. Untuk memeriksa versi paket Node.js dan npm Anda, jalankan perintah berikut di terminal:

Untuk memeriksa versi Node.js yang diinstal, cetak versi tersebut dengan perintah berikut:

simpul --Versi: kapan

Anda dapat memeriksa versi npm menggunakan opsi yang sama:

npm --Versi: kapan

2. Instal CLI Sudut

Anda dapat menggunakan Angular CLI untuk melakukan berbagai tugas pengembangan. Tugas tersebut meliputi pembuatan aplikasi, pengujian, dan penggelaran. Untuk menginstal Angular CLI, jalankan perintah berikut:

$ npm instal -g @sudut/cli

Untuk memeriksa versi Angular CLI, jalankan perintah:

versi $ng

3. Temukan Proyek di GitHub

Anda akan mengkloning Giphy-Replika proyek dari GitHub:

Arahkan ke tombol hijau berlabel Kode. Klik di atasnya untuk membuka daftar dropdown. Salin tautan HTTP atau SSH. Salah satu dari keduanya akan dilakukan.

4. Kloning Proyek Secara Lokal

Pertama, buat folder dan beri nama Angular-Clone. Ingatlah untuk pergi ke folder dengan perintah berikut:

cd Sudut-Klon

Kemudian, jalankan klon git perintah untuk menyalin proyek ke folder Anda.

git klon https://github.com/Reuben-Kipkemboi/Giphy-Replica.git

Selanjutnya, periksa folder Angular-Clone untuk melihat apakah klon Giphy-Replica ada di dalamnya. Berlari ls untuk menampilkan isi folder:

ls

Arahkan ke folder:

CD Giphy-Replika

Pada titik ini, Anda dapat memeriksa file proyek dalam editor kode pilihan Anda atau melihatnya melalui antarmuka web GitHub.

5. Instal Paket npm

Anda perlu menginstal semua paket dan dependensi dari proyek kloning untuk menjalankannya. Untuk menginstal paket, jalankan:

npm Install

Jika Anda menemukan laporan kerentanan apa pun, perbaiki dengan:

perbaikan audit npm

6. Buka Proyek di Browser

Sekarang Anda memiliki semua persyaratan untuk menjalankan proyek, Anda dapat menjalankannya dan membukanya di browser. Mulailah dengan membangun dan melayani proyek:

melayani

Lalu buka http://localhost: 4200/ di browser untuk melihat proyek.

Anda dapat menggunakan Angular CLI secara otomatis membuka proyek di browser:

$ ng melayani -o

Perintah ini membangun aplikasi, meluncurkan server, dan mengawasi file untuk pembaruan.

Di browser Anda, Anda akan melihat situs web Giphy-Replica:

Mengapa Mengkloning Proyek Angular?

Alih-alih memulai proyek dari awal, Anda dapat mengkloningnya dari GitHub. Mengkloning proyek sumber terbuka dan memodifikasinya untuk penggunaan Anda sendiri akan menghemat waktu daripada memulai proyek dari awal. Anda juga dapat memberikan kontribusi perubahan yang berguna kembali ke proyek upstream jika relevan.

Terpilih sebagai framework front-end terpopuler keempat di tahun 2021, Angular terus memukau di setiap rilisnya. Muncul dengan paket hebat yang mendukung pengembangan aplikasi satu halaman. Gunakan kerangka kerja luar biasa ini untuk membangun aplikasi kelas dunia.