How to create a bitbucket CI/CD pipeline ( React JS )

Step 1 — Logging in as root

ssh root@your_server_ip

Step 2 — Creating a New User

adduser sammy

Step 3 — Granting Administrative Privileges

usermod -aG sudo sammy

Step 4 — Setting Up a Firewall
If your domain is registered, then both OpenSSH and Nginx Full will run. Otherwise, only Nginx HTTP will run. In Nginx Full mode, both HTTP and HTTPS are available.

ufw app list


ufw allow OpenSSH


ufw enable


ufw status

Step 5 — Enabling External Access for Your Regular User
Configuring SSH access for your new user depends on whether your server’s root account uses a password or SSH keys for authentication.

If the root Account Uses SSH Key Authentication
If you logged in to your root account using SSH keys, then password authentication is disabled for SSH. To log in as your regular user with an SSH key, you must add a copy of your local public key to your new user’s ~/.ssh/authorized_keys file.
Since your public key is already in the root account’s ~/.ssh/authorized_keys file on the server, you can copy that file and directory structure to your new user account using your current session.
The simplest way to copy the files with the correct ownership and permissions is with the rsync command. This command will copy the root user’s .ssh directory, preserve the permissions, and modify the file owners, all in a single command. Make sure to change the highlighted portions of the command below to match your regular user’s name:

rsync --archive --chown=sammy:sammy ~/.ssh /home/sammy

Now, open up a new terminal session on your local machine, and use SSH with your new username:

ssh sammy@your_server_ip

You should be connected to your server with the new user account without using a password. Remember, if you need to run a command with administrative privileges, type sudo before the command like this:

sudo command_to_run

Step 6 — In your bitbucket
Go to repository setting and click on SSH keys, add your server ip address

Now fetch and then add host.
Step 7 — Copy publicKey
At same page of step 6 you can see generate ssh keys, click on it and copy public key

Step 8 — Paste public key to ~/.ssh/authorized_keys

sudo nano ~/.ssh/authorized_keys

Step 9 — Add SSH key to bitbucket from server
Run this command on server

cat ~/.ssh/id_rsa.pub

If it is present copy it otherwise generate ssh key and then again run this command.

ssh-keygen

After run this command again run

cat ~/.ssh/id_rsa.pub

Copy the ssh key and add it in ssh keys in bitbucket personal setting.

Step 10 — Change in /etc/ssh/sshd_config

sudo nano /etc/ssh/sshd_config

#PubkeyAuthentication yes                                                                                                                                                                   
PubkeyAcceptedKeyTypes=+ssh-rsa

Find both line if it is present then remove # from start.

Like

PubkeyAuthentication yes 
PubkeyAcceptedKeyTypes=+ssh-rsa

Otherwise add both lines.

Step 11 — Set remote origin ssh url

git remote set-url origin repo url 
git remote set-url origin [e-mail]:<github-username>/<repo-name>.git

Step 12 — Create two files bitbucket-pipelines.yml and deploy.sh

bitbucket-pipelines.yml

pipelines:
  branches:
    staging:
      - step:
          script:
            - cat ./deploy.sh | ssh sammy@server-ip -T
            - echo "Deployment Completed"

deploy.sh

echo "Change project directory to: /var/www/project directory"
cd /var/www/project directory
# Pull the latest changes from the git repository
echo "Pulling latest changes from the git repo after resetting hard"
git reset --hard
git checkout staging
git pull origin staging
echo "creating an optimize build"
npm install
echo 'Deployment finished on staging.'

Now enable and run your initial pipeline  🎉