# რეაქტის პროექტის სერვერზე გამართვა

## შესავალი

და დგება ის მომენტი, როდესაც შენ მზად ხარ რომ შენი აპლიკაცია მსოფლიოს აჩვენო, რისთვისაც შენ პროექტი უნდა გამართო სერვერზე და [https://my-app.ge](https://my-app.ge/) -ის დომეინი მიაბა,

ჩვენ ვიცით ლოკალურად როგორ უნდა გავუშვათ დეველოპმენტ სერვერი: `npm start` და ეგ არი.

მაგრამ პროდაქშენის სერვერზე ამას ვერ ვიზამთ.

პროდაქშენზე ჩვენ უნდა გამოვიყენოთ ხელსაწყო რომელიც ჩვენ საიტს საათივით აამუშავებს, ეს ხელსაწყო არის nginx.

Nginx-ი უზრუნველყოფს იმას, რომ ჩვენმა საიტმა ოპტიმალურად გამოიენოს სერვერის რესურსები, გვაძლევს საშვალებას რომ რამოდენიმე პროექტი გავუშვათ ერთ სერვერზე , გვქონდეს ქეშირება და ა.შ.

## სერვერზე ხელსაწყოების და პროგრამების დაყენება

პირველ რიგში, ჩვენ უნდა დავლოგინდეთ სერვერზე რისთვისაც უნდა გავუშვათ ბრძანება&#x20;

`ssh username@ipAdress`

ამის შემდეგ ჩვენ უნდა გავუშვათ ბრძანება `sudo apt update`

ეს ბრძანება ფექიჯების შესახებ ინფორმაციას განაახლებს სერვერზე, იმისთვის რომ როცა ჩვენ დავწერთ sudo `apt install something` -ს, სერვერმა იცოდეს რა არის ეს `something`

ამის შემდეგ ჩვენ უნდა დავაყენოთ node ამის გაკეთება შეგვიძლია შემდეგი ბრძანებით:

`curl https://deb.nodesource.com/setup_16.x | sudo bash`&#x20;

`sudo apt install nodejs`

## სერვერზე React-ის პროექტის გამრთვა

ჩვენ home საქაღალდეში შევქმნათ apps-ს საქაღალდე სადაც გვექნება აპლიკაციები რომლებსაც სერვერზე გავმართავთ, აპლიკაციების apps-ს საქაღალდეში შენახვა, home-ში შენახვასთან შედარებით უკეთეს პრაქტიკად ითვლება.

შემდეგ შევიდეთ apps საქაღალდეში და დავკლონოთ github-იდან რეპოზიტორია:

`cd ~`

`mkdir apps`

`cd apps`

`git clone` [`https://github.com/my-app.git`](https://github.com/my-app.git)

თუ ვნახავთ apps საქაღალდის შიგთავს: `ls` ბრძანებით ჩვენ დავინახავთ რომ ჩვენი პროექტი ჩამოიტვირთა, მოდი ეხლა შევიდეთ პროექტის საქაღალდეში და დავიწყოთ მისი გამართვა.

`cd my-app`

`npm install`

დეველოპმენტ გარემოში ეხლა უბრალოდ გავუშვებდით `npm start`-ს და ყველაფერი კარგად იქნებოდა, მაგრამ რექტს აქვს ასეთი ბრძაება

&#x20;`npm run build`&#x20;

რომელიც ჩვენ აპლიკაციის პროდაქშენის build-ს დააგენერირებს და ოპტმიზაციებს უკეთებს.

ამ ბრძანების გაშვების შემდეგ ჩვენ პროექტში უნდა დამატებოდა ერთი საქაღალდე სახელად build-ი, რომელის შიგთავსაც გამოვიყენებთ საიტის დომენზე გასამართად.

## Nginx-ის კონფიგურაცია

ეხლა უკვე დროა რომ ჩვენი უკვე სერვერზე მყოფი პროექტი მსოფლიოსთვის მიღწევადი გავხადოთ, რისთვისაც უნდა გავმართოთ nginx-ი, მოდი მისი დაინსტალირებით დავიწყოთ:

&#x20;`sudo apt install nginx`

სერვერზე შევიდეთ შემდეგ ფოლდერში:

`cd /etc/nginx/sites-enabled`

თუ ჩვენ ამ საქაღალდეში გავუშვებთ `ls`-ს ბრძანებას უნდა დავინახოთ default-ი ფაილი, რომელიც შეგვიძლია თამამად ამოშალოთ: `sudo rm default` და ჩვენი ახალი კონფიგურაციის ფაილი შევქმნათ:

`sudo touch my-app.ge`

ეს ფაილი უნდა გავხსნათ `sudo nano my-app.ge` -ი ბრძანებით და შიგნით ჩავწეროთ შემდეგი კონფიგურაცია:

```
server {
        listen 80;
        # absolute path to your project's build folder
        root /home/giga/apps/my-app/build;
        # if u are using vite project change build to dist

        index index.html;
        
        # your DNS name
        server_name my-app.com;

        location / {
                try_files $uri /index.html;
        }
}
```

შემდეგ ეს ფაილი შევინხაოთ და გავუშვათ ბრძანება

`sudo systemctl restart nginx`

და ჩვენ თუ ვეწვევით [http://my-app.ge](http://my-app.ge/) -ს ჩვენ და ნებისნიერი ადამიანი დაინახავს ჩვენ პროექტს, მაგრამ ერთი რაღაც ჭირს ჩვენ საიტის, ის http-ზეა გამართული და შენმა ბრაუზერმა შეიძლება გაგაფრთხილა, რომ ეს საიტი არ არის უსაფრთხო, საბედნიეროდ https-ზე გამართვა ძალიან მარტივია.

## SSL-ის დაყენება LetsEcrypt-ით

იმისთვის რომ LetsEncrypt-ის სერთიფიკატი დავაყენოთ ჩვენ საიტზე და ის უსაფრთხო გავხადოთ, რამოდენიმე ფექეჯი უნდა დავაინსტალიროთ:

`sudo apt install certbot python3-certbot-nginx`

შემდეგ გავუშვათ ბრძანება:

`sudo certbot`

და მივყვეთ certbot-ის ინსტრუქციებს

რის შემდეგაც ჩვენი საიტი გამოიყენებს https -ს და ის იქნება უსაფრთხო და უკვე ხალხის შეშინების გარეშე შეძლებ შენი პროექტის გაზიარებას.

## დასკვნა

რექტის პროექტის პროდაქშენის სერვერზე გასამართად ჩასატარებელია რიგი პროცედურები:

* სერვერზე საჭირო ფექეჯების დაყენება
* პროექტის ჩამოტვირთვა და build პროცესის გაშვება
* Nginx-ის კონფიგურაცია
* LetsEncrypt-ით SSL-ის დაყენება

აბა შენ იცი :wave:
