συστήματα

Γνώση Υπολογιστών >> συστήματα >  >> Ubuntu

Πώς να εγκαταστήσετε το ReactJS στο Ubuntu 20.04 LTS (Focal Fossa)

## Εισαγωγή

Το ReactJS είναι μια δημοφιλής βιβλιοθήκη JavaScript για τη δημιουργία διεπαφών χρήστη. Χρησιμοποιεί μια αρχιτεκτονική βασισμένη σε στοιχεία, καθιστώντας εύκολη τη δημιουργία πολύπλοκων και διαδραστικών εφαρμογών. Σε αυτό το σεμινάριο, θα σας δείξουμε πώς να εγκαταστήσετε το ReactJS στο Ubuntu 20.04 LTS (Focal Fossa).

Προαπαιτούμενα

Πριν ξεκινήσετε, θα χρειαστείτε τα εξής:

* Ένας υπολογιστής με Ubuntu 20.04 LTS.

* Ένα πρόγραμμα επεξεργασίας κειμένου (όπως nano ή vi).

* Ένας εξομοιωτής τερματικού (όπως το GNOME Terminal ή Konsole).

Βήμα 1:Εγκαταστήστε το Node.js

Το ReactJS απαιτεί την εκτέλεση του Node.js. Για να εγκαταστήσετε το Node.js, ακολουθήστε τα εξής βήματα:

1. Ανοίξτε έναν εξομοιωτή τερματικού.

2. Ενημερώστε το ευρετήριο πακέτου:

```

sudo apt ενημέρωση

```

3. Εγκαταστήστε το Node.js:

```

sudo apt εγκατάσταση nodejs

```

Βήμα 2:Εγκατάσταση npm

Το npm είναι ο διαχειριστής πακέτων για το Node.js. Για να εγκαταστήσετε το npm, ακολουθήστε τα εξής βήματα:

1. Ανοίξτε έναν εξομοιωτή τερματικού.

2. Εγκαταστήστε το npm:

```

sudo apt εγκατάσταση npm

```

Βήμα 3:Δημιουργήστε ένα έργο ReactJS

Για να δημιουργήσετε ένα νέο έργο ReactJS, ακολουθήστε τα εξής βήματα:

1. Ανοίξτε έναν εξομοιωτή τερματικού.

2. Μεταβείτε στον κατάλογο όπου θέλετε να δημιουργήσετε το έργο:

```

cd ~/projects

```

3. Εκτελέστε την ακόλουθη εντολή για να δημιουργήσετε ένα νέο έργο:

```

npx create-react-app my-app

```

Αυτό θα δημιουργήσει έναν νέο κατάλογο που ονομάζεται "my-app" που περιέχει όλα τα απαραίτητα αρχεία για ένα έργο ReactJS.

Βήμα 4:Ξεκινήστε τον διακομιστή ανάπτυξης

Για να ξεκινήσετε τον διακομιστή ανάπτυξης, ακολουθήστε τα εξής βήματα:

1. Ανοίξτε έναν εξομοιωτή τερματικού.

2. Μεταβείτε στον κατάλογο του έργου:

```

cd ~/projects/my-app

```

3. Εκτελέστε την ακόλουθη εντολή για να ξεκινήσετε τον διακομιστή ανάπτυξης:

```

npm έναρξη

```

Αυτό θα ξεκινήσει τον διακομιστή ανάπτυξης στη θύρα 3000. Τώρα μπορείτε να ανοίξετε το πρόγραμμα περιήγησής σας και να μεταβείτε στο `localhost:3000` για να δείτε την εφαρμογή ReactJS.

Βήμα 5:Επεξεργαστείτε την εφαρμογή

Ο πηγαίος κώδικας για την εφαρμογή ReactJS βρίσκεται στον κατάλογο `src`. Το κύριο στοιχείο για την εφαρμογή είναι το αρχείο «App.js». Μπορείτε να επεξεργαστείτε αυτό το αρχείο για να αλλάξετε τον τρόπο εμφάνισης και λειτουργίας της εφαρμογής.

Για παράδειγμα, για να αλλάξετε τον τίτλο της εφαρμογής, μπορείτε να επεξεργαστείτε το αρχείο «App.js» και να αλλάξετε την ακόλουθη γραμμή:

```

Επεξεργασία src/App.js και αποθηκεύστε για να φορτώσετε ξανά.

className="Σύνδεσμος εφαρμογής"

href="https://reactjs.org"

target="_blank"

rel="noopener noreferrer"

>

Μάθετε React

```

στα ακόλουθα:

```

Γεια, Κόσμος!

className="Σύνδεσμος εφαρμογής"

href="https://reactjs.org"

target="_blank"

rel="noopener noreferrer"

>

Μάθετε React

```

Αυτό θα αλλάξει τον τίτλο της εφαρμογής σε "Hello, World!".

Βήμα 6:Δημιουργήστε την εφαρμογή

Όταν είστε έτοιμοι να αναπτύξετε την εφαρμογή ReactJS, μπορείτε να την δημιουργήσετε για παραγωγή εκτελώντας την ακόλουθη εντολή:

```

npm εκτέλεση κατασκευής

```

Αυτό θα δημιουργήσει έναν κατάλογο «build» που περιέχει όλα τα απαραίτητα αρχεία για την έκδοση παραγωγής της εφαρμογής.

Βήμα 7:Αναπτύξτε την εφαρμογή

Η διαδικασία ανάπτυξης για μια εφαρμογή ReactJS εξαρτάται από την πλατφόρμα φιλοξενίας που χρησιμοποιείτε. Για περισσότερες πληροφορίες, ανατρέξτε στην τεκμηρίωση για την πλατφόρμα φιλοξενίας σας.

Συμπέρασμα

Σε αυτό το σεμινάριο, σας δείξαμε πώς να εγκαταστήσετε το ReactJS στο Ubuntu 20.04 LTS (Focal Fossa). Σας δείξαμε επίσης πώς να δημιουργήσετε μια απλή εφαρμογή ReactJS και πώς να επεξεργαστείτε τον κώδικα για να αλλάξετε την εμφάνιση και τη λειτουργικότητά της.

Συναφής σύστασή

Πνευματικά δικαιώματα © Γνώση Υπολογιστών Όλα τα δικαιώματα κατοχυρωμένα