> For the complete documentation index, see [llms.txt](https://redberry.gitbook.io/resources/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://redberry.gitbook.io/resources/vue/vue.js-proektis-serverze-gamartva.md).

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

## შესავალი

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

Vue.js პროექტის შემთხვევაში, nginx-ის დახმარებით, ეს საქმე არც ისე რთულია. პროექტს გავმართავთ ubuntu-ს ოპერაციულ სისტემაზე.

## სერვერის მომზადება

პირველ რიგში დავლოგინდეთ სერვერზე

```bash
ssh username@ipAdresss
```

შემდეგ განვაახლოთ apt package-ების მისამართები

```bash
 sudo apt update
```

დავაინსტალიროთ ნოუდი

```bash
curl https://deb.nodesource.com/setup_16.x | sudo bash 
sudo apt install nodejs
```

## პროექტის მომზადება

home დირექტორიაში შევქმნათ apps დირექტორია და ჩამოვიტანოთ ჩვენი პროექტი რემოუთ რეპოზიტორიიდან

```bash
cd ~
mkdir apps
cd apps
git clone https://github.com/my-app.git
```

შევიდეთ პროექტის დირექტორიაში, დავაინსტალიროთ აპლიკაციისთვის საჭირო ფექიჯები და დავბილდოთ 

```bash
cd {project_folder}
npm install
npm run build
```

თუ ყველაფერმა წარმატებით ჩაიარა, დირექტორიაში უნდა შექმნილიყო dist ფოლდერი, რომელსაც შემდეგ გამოვყენებთ nginx-ის კონფიგურაციაში

## Nginx-ის დაინსტალირება და კონფიგურაცია

### დაინსტალირება

```bash
sudo apt install nginx
```

იმისთვის რომ დავრწუნდეთ nginx-ის მუშაობაში გავუშვათ ბრძანება `service nginx status`

### კონფიგურაცია

შევიდეთ შემდეგ მისამართზე `cd /etc/nginx/sites-enabled`

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

ახლა გავსნათ ფაილი ჩვენი პროექტისთვის ჩვენთვის მოსახერხებელ ედიტორში 

`sudo vi my-app.ge` 

 და ჩავწეროთ შემდეგი კონფიგურაცია

```nginx
server {
    listen      80;
    # change example.com with your domain name
    server_name example.com;
    charset utf-8;
    # change {{app_root}} with your application path
    root    {{app_root}}/dist;
    index   index.html index.htm;
    # Always serve index.html for any request
    location / {
        # change {{app_root}} with your application path
        root {{app_root}}/dist;
        try_files $uri /index.html;
    }
    error_log  /var/log/nginx/vue-app-error.log;
    access_log /var/log/nginx/vue-app-access.log;
}
```

შევინახოთ ფაილი `:wq`

შევამოწმოთ კონფიგურაციის სინტაქსი `sudo nginx -t`

გადავარესტარტოთ სერვერი `sudo systemctl restart nginx`

ახლა თუ ვეწვევით ჩვენს დომეინს <http://example.com-ზე> შეგვეძლება რომ ჩვენი აპლიკაცია ვიხილოთ, მაგრამ საქმე დასრულებულად რომ ჩავთვალოთ ერთი პატარა რაღაც დაგვრჩა, გადავიყვანოთ ჩვენი პროექტი https პროტოკოლზე.

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

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

`sudo apt install certbot python3-certbot-nginx`

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

`sudo certbot`

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

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

## დასკვნა

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

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