# Deploy Vercel

## 1. Creare proiect & Deploy

{% hint style="info" %}
Creăm un nou cont de Vercel și alegem să ne conectăm cu contul de GitHub.
{% endhint %}

<figure><img src="https://3115159084-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FhhbPpHsnY2kIOgk08P4h%2Fuploads%2FXAjlixnFoMn4syio2y53%2Fimage.png?alt=media&#x26;token=e4d64828-bc1e-40d0-b1d5-1bb016b4e9cd" alt=""><figcaption></figcaption></figure>

Urmează să îi dăm lui Vercel drepturile necesare să vadă lista cu toate repository-urile noastre.

<figure><img src="https://3115159084-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FhhbPpHsnY2kIOgk08P4h%2Fuploads%2F7qxEKqeMj6GTePTm53Bu%2Fimage.png?alt=media&#x26;token=55cbf8c8-1bcd-48e5-8a4e-cf648ccd9fa2" alt=""><figcaption></figcaption></figure>

Urmează să importăm proiectul pe care vrem să îl publicăm.

<figure><img src="https://3115159084-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FhhbPpHsnY2kIOgk08P4h%2Fuploads%2Fgqb9wfBDb7QPBa6XaFSe%2Fimage.png?alt=media&#x26;token=e698bb59-0e42-4848-8856-b48c9f7daa0b" alt=""><figcaption></figcaption></figure>

## 2. Configurare proiect și chei de environment

<figure><img src="https://3115159084-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FhhbPpHsnY2kIOgk08P4h%2Fuploads%2F3m4zPwXBaclXH8SwLz5A%2Fimage.png?alt=media&#x26;token=f1b2bf35-5c78-4c6c-819b-40dcee0176c4" alt=""><figcaption></figcaption></figure>

Urmează procesul de deploy.

<figure><img src="https://3115159084-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FhhbPpHsnY2kIOgk08P4h%2Fuploads%2Fp89Y6SMAQVzZRdYKdjnK%2Fimage.png?alt=media&#x26;token=17f70852-b0b1-4e38-8845-31126a48a001" alt=""><figcaption></figcaption></figure>

Dacă totul a funcționat cum trebuie, ar trebui să putem fi redirecționați către următoare pagină.

<figure><img src="https://3115159084-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FhhbPpHsnY2kIOgk08P4h%2Fuploads%2FIU3GzRmnt41HrWxj2vNg%2Fimage.png?alt=media&#x26;token=6d16cfdb-3793-4c19-aa48-0d95e375f8f6" alt=""><figcaption></figcaption></figure>

## 3. Accesarea site-ului și adăugarea unui nou IP în MongoDB Cloud

{% hint style="danger" %}
După ce partea de deploy s-a finalizat cu succes, există șanse foarte mari ca dacă o să încercăm să accesăm link-ul pe care ni l-a pus la dispoziție, să primim o eroare în ceea ce priveste requestul entry-urilor din colecția records.
{% endhint %}

<figure><img src="https://3115159084-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FhhbPpHsnY2kIOgk08P4h%2Fuploads%2FlYiPciPB8nWUpLfOWDck%2Fimage.png?alt=media&#x26;token=c6397c4a-3b88-4f49-9f2a-fc8f0fab913e" alt=""><figcaption></figcaption></figure>

<figure><img src="https://3115159084-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FhhbPpHsnY2kIOgk08P4h%2Fuploads%2FwxWDJgqI26fAgI4DIDYJ%2Fimage.png?alt=media&#x26;token=e77c4777-6326-418c-8db8-3d465770074d" alt=""><figcaption></figcaption></figure>

O să ne conectăm pe <mark style="color:green;">**MongoDB Cloud**</mark>, mergem la secțiunea **Network Access** și o să adăugăm un nou IP prin care o să oferim dreptul oricui care cere date de la noi, să i le oferim.

<figure><img src="https://3115159084-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FhhbPpHsnY2kIOgk08P4h%2Fuploads%2Fqe0v8SctYBPLLKUIy6oN%2Fimage.png?alt=media&#x26;token=346bce35-6f3e-453a-b913-0b33ca08d28a" alt=""><figcaption></figcaption></figure>

După adăugarea noului IP, ar trebui să putem avea următoarea listă:

<figure><img src="https://3115159084-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FhhbPpHsnY2kIOgk08P4h%2Fuploads%2FSQDmovjc0eyvh0aI2Erl%2Fimage.png?alt=media&#x26;token=e758a1f0-f4f3-4062-9360-80bfb054b88b" alt=""><figcaption></figcaption></figure>

Revenim pe site, dăm un refresh și ar trebui să putem vedea lista de records.

## 4. Redeploy

{% hint style="info" %}
De fiecare dată când o să dăm push, Vercel se va ocupa singur să dea redeploy la noul cod.
{% endhint %}

În cazul în care dorim să dăm noi un redeploy manual, mergem pe Vercel la secțiunea **Deployments**, și alegem la ce vrem să dăm **redeploy**.

<figure><img src="https://3115159084-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FhhbPpHsnY2kIOgk08P4h%2Fuploads%2FuRrHFx3XoJAqntgvYvyj%2Fimage.png?alt=media&#x26;token=1b9bb973-de9e-4e7f-9daa-c69945228ea9" alt=""><figcaption></figcaption></figure>

Ulterior, apăsăm pe cele trei puncte și pe **Redeploy**.

<figure><img src="https://3115159084-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FhhbPpHsnY2kIOgk08P4h%2Fuploads%2FHvIg2AgtbFULMzUQacy5%2Fimage.png?alt=media&#x26;token=cda19530-ce5d-40d1-aad2-ae7139ef7021" alt=""><figcaption></figcaption></figure>
