# OMNI Application Deployment Steps

:::success

:bulb: **Prerequisites for React App Deployment.**

1. A server and A Domain (AWS / Digital Ocean or etc)
2. Node 16.17.0 or greater.
3. Git Repository of the project.
4. Nginx
:::

1. Operating System: Linux: Is this Linux or Redhat Linux and what is the version to be used?
*We shall use Ubuntu 20.04 LTS OS*

2. Is this Development and Production systems ?
*Yes for both*
3. Storage Amount: 100 GB: is this considered for one system or two systems ? Have you considered the OS disk space utilization as well?
*Increase the size basis on the client requirement and usage. Apart from this, we use S3 for application storage.*
4. Do we need to consider public ip for these web portals?
*We reserve static ip using elastic ip*
5. Please addon if there are any additional requirements. We shall also need RDS (with 4GB CPU, 50GB Storage) to be included.

### Server Config (Minimum Requirements)
Operating system (Linux - Ubuntu 20.04 LTS), Quantity (2), Pricing strategy (EC2 Instance Savings Plans 1 Year No Upfront), Storage for each EC2 instance (General Purpose SSD (go2)), Storage amount (100 GB), Instance type (t3a.xlarge)
### Installing Node with NVM on Ubuntu

1. $ sudo apt install curl (optional)

2. $ curl https://raw.githubusercontent.com/creationix/nvm/master/install.sh | bash 

3. $ source ~/.bashrc  

4. $ nvm install 16.17.0

5. $ nvm use 16.17.0

### Install Git on Ubuntu

1. $ git --version  (if not install run below command)
2. $ sudo apt install git

### Here's a step-by-step guide to buy domain and map it to server:

1. **Choose a Domain Registrar:** Select a reputable domain registrar where you can purchase your domain. Popular registrars include GoDaddy, Namecheap, and Google Domains. Visit their websites and sign up for an account.
2. **Purchase a Domain (ignore if purchased):** Once you have an account with a domain registrar, use their domain search tool to find an available domain name that suits your needs. Follow the prompts to complete the purchase of the domain.
3. **Choose a Cloud Server:** Next, you'll need to select a Cloud Server for your web app. A Cloud Server stores your files and makes it accessible on the internet. Popular cloud servers include AWS, Digital Ocean, Azur, etc. Sign up for an account with your chosen provider.
4. **Obtain Server Information:** After signing up for hosting, you'll receive server information, typically in the form of nameservers or IP addresses. Make a note of this information, as you'll need it to configure your domain later.
5. **Access Domain Settings:** Go back to your domain registrar's website and log in to your account. Locate the domain you purchased and access its settings or management panel.
6. **Configure DNS Settings:** Look for the DNS (Domain Name System) settings or DNS management section in your domain settings. You'll typically find options for nameservers, A records, CNAME records, or DNS records.
7. **Add DNS Records:** If your cloud server uses IP addresses instead of nameservers, you may need to create DNS records such as A records or CNAME records. Follow the instructions provided by your cloud server to add these records in your domain's DNS settings.
8. **Wait for DNS Propagation:** DNS propagation is the process of updating DNS records across the internet. It can take some time for the changes you made to propagate globally. The propagation process can take anywhere from a few minutes to 48 hours.
9. **Test and Verify:** Once DNS propagation is complete, visit your domain in a web browser to see if it correctly points to your server. If everything is configured correctly, you should see your website or the default page provided by your cloud server.

### Here's a step-by-step guide to deploying a React app for production using Nginx and Git Hub:

1. Clone the React app repository from Git Hub to your local machine using the following command:

git clone https://github.com/Techpurpleplum/omni-webapp.git

2. Install the necessary dependencies by running the following command in the project directory:

npm install

3. Build the React app for production by running the following command:

npm run build

4. This will generate a production-ready build of your app in the build folder. Install Nginx if it is not already installed on your server by running the following command (Linux):

sudo apt-get install nginx

5. Create a new Nginx server block for your React app by creating a new configuration file in the `/etc/nginx/sites-available` directory. You can name the file anything you like, but it should end with `.conf`. Here's an example configuration file:

server {
    listen 80;
    server_name omni.com;

    root /var/www/html/omni-webapp/build;
    index index.html;

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

This configuration tells Nginx to listen on port 80 (HTTP) and serve files from the build folder of your app when someone visits omni.com. The location / block ensures that all requests are routed to index.html, which is the entry point for your React app.

Replace "omni.com" with the domain name that you have purchased.

6. Create a symbolic link to your new server block in the `/etc/nginx/sites-enabled` directory by running the following command:

sudo ln -s /etc/nginx/sites-available/omni.conf /etc/nginx/sites-enabled/

7. Confirm that the `sites-enabled` directory is included in the `nginx.conf` file, you can check for the presence of the `include /etc/nginx/sites-enabled/*;` directive in the `http` block of the `nginx.conf` file. If not include this line in `http` block of the nginx.conf

8. Test the Nginx configuration by running the following command:

sudo nginx -t

If there are no errors, restart Nginx by running the following command:

sudo systemctl restart nginx

9. Point your domain name to your server's IP address and test your React app in a web browser.

### Production Release (Manual):

1. Login to the Sever and remove the build(folder) from the nginx configured path, using

rm -rf /var/www/html/omni-webapp/build

2. Generate the latest build from local system from the project repository and upload the generated build folder to server using **scp** or **Filezilla**

scp -r .\build\ [username]@[server-ip]:/var/www/html/omni-webapp