bitbucket-pipelines.yml

# This is a sample build configuration for React.
# Check our guides at https://confluence.atlassian.com/x/e8YWN for more examples.
# Only use spaces to indent your .yml configuration.
# -----
# You can specify a custom docker image from Docker Hub as your build environment.
image: node:10.15.3

pipelines:
  default:
    - step:
        caches:
          - node
          - pip
        script:
          - npm install
          - npm test
  branches:
    master:
    - step:
        name: Pulling code to server
        #trigger: manual
        #deployment: production
        caches:
          - node
        script:
          - echo "Running build"
          #- apt-get update && apt-get install -y unzip
          #- apt-get install openssh-server -y
          #- echo $REPO_ORIGIN_URL
          #- echo $DEPLOY_USER_J
          #- echo $DEPLOY_HOST_J
          #- echo $PROJECT_FOLDER_PATH
          #- echo $FRONTEND_FOLDER_PATH
          #- echo $FRONTEND_FOLDER_NAME
          #- echo $FRONTEND_LIVE_URL
          - ssh $DEPLOY_USER_J@$DEPLOY_HOST_J 'bash -s' < execute.sh $REPO_ORIGIN_URL $PROJECT_FOLDER_PATH $FRONTEND_FOLDER_PATH $FRONTEND_FOLDER_NAME $FRONTEND_LIVE_URL
   

CI CD Pipeline For React_Bitbucket

1. create repo to bitbucket.
2. Enable pipeline from repo settings.
3. create 2 files to current repo. (bitbucket-pipelines.yml and execute.sh)
4. Now commit any push to local pc and you can navigate to pipeline page to repo.

Create repo pipeline environment variables to repository settings.
******************************************************************
1. DEPLOY_USER_J -> write server username for login
		root

2. DEPLOY_HOST_J -> server ip address
		194.163.165.59

3. REPO_ORIGIN_URL -> bitbucket repo url with token password
		https://usernmae:app_token@bitbucket.org/workspace_username/repo_name.git

4. PROJECT_FOLDER_PATH -> where your code project is there
		/var/www/html/jatin/ci-cd-react-code

5. FRONTEND_FOLDER_PATH -> write path for react frontend folder name
		/var/www/html/jatin/ci-cd-react-live

6. FRONTEND_FOLDER_NAME -> write folder name for react frontend
		ci-cd-react-live

7. FRONTEND_LIVE_URL -> this will be used for creating build with PUBLIC_URL
	http://194.163.165.59/jatin/ci-cd-react-code

execute.sh

echo "Folder path -> " . $2
#eg.  cd /var/www/html/test-demo-code
cd $2
echo "pulling from -> " . $1
git pull $1;

if [ $? -eq 0 ]; then
  echo 'git pull success.'
else
  echo 'git pull failure.'
  exit 1;
fi

npm install;
echo "Creating build with PUBLIC URL -> " . $5;
PUBLIC_URL=$5 npm run build;
cd /var/www/html/jatin;

#delete folder if already exists
#eg. test-demo named folder deleted
echo "Deleting exist directory for project -> " . $4;
rm -r $4;

# create directory again fresh folder
#eg. test-demo named folder created
mkdir -p $4;

#navigate to that directory
# cd /var/www/html/test-demo-live
echo "Navigating to directory -> " . $3;
cd $3;

echo "Copy all new build files to current folder -> " . $3;
#copy build files to current frontend demo
#eg.  cd /var/www/html/test-demo-code/build/* to test-demo-live
cp -r $2/build/* .

#Setting up htaccess file for react
#eg.  cd /var/www/html/test-demo-code/.htaccessreact to test-demo-live/.htaccess
echo "Copy react project htaccess files -> " . $3;
cp $2/.htaccessreact .htaccess;
exit