SpringBot Development Environment: Source Code Virtual Machine

Setup project source

There are two different virtual machine setup options you can select from:

Drive Mapping
Remote code editing over SSH using VS Code

Note: Some Mac users have experienced technical difficulties running VirtualBox.

Option 1: Drive Mapping

It is possible to map a drive from your development (local / host) environment into your server (virtual) environment. This allows you to use software on your development environment to edit your source and these changes are immediately reflected in your server environment.

Setup

On development environment:

First, setup your application source code on your local environment

NB: It is best practice to store the source on an encrypted drive. From this point on, on Windows it is assumed that G: is your encrypted drive, and on Mac or Linux your whole drive is encrypted.

Setup Project Drive or Directory
Windows
All project source files should be cloned in G:.

Mac or Linux
Create the directory /data/repository:
```
 sudo mkdir /data
 cd /data
 sudo mkdir repository
 sudo chown user:user repository
 cd repository
```
Clone your repository (substituting in your provided git URL) and switch to the develop branch
Git client
You can download a free git client such as Git Kraken and clone your repository into your [project drive or directory]
Command line
If you prefer to use the command line (i.e, “Command Prompt” for windows, “Terminal” for Linux and Mac), you can install the git command line tool from https://git-scm.com/downloads for your operating system. The commands to enter to clone your application repository are:
```
 cd [project drive or directory]
 git clone https://git.codebots.com/cb[subdomain]/[project-slug].git
 cd [project-slug]
 git checkout develop
```

In VirtualBox, make sure your server is not running and go to Settings > Shared Folders

Click the “Add new folder” icon on the right
Set the folder path to wherever all of your git repositories reside (e.g G:)
Folder name: repository
Do not check Read Only
Do not check Auto Mount
Check Make Permanent (if given the option)

We now need to power on the machine.

On server environment:

You need to find out the ID for the account that was created on Ubuntu during the setup. Type in the following and press enter:
```
 cat /etc/passwd
```
Take note of the UID and GID assigned to the user account. It should be 1000 for both as per the image below, but may be different:
Create a bash script to mount the core on boot
```
 sudo nano /home/mount_core.sh
```

Put the contents below in the file, replacing the uid and gid in the second last line if required.

 #!/bin/bash
 echo "Running mount_core.sh..."
    
 lsmod > /tmp/lsmod
    
 sleep 5
 if [ ! -d "/data/repository" ]; then
      echo "CREATE /data"
      sudo mkdir /data
      echo "CREATE /data/repository"
      sudo mkdir /data/repository
      sudo chown -R user:user /data
 fi
    
 # The uid and gid need to match the value of your passwd file
 sudo mount -t vboxsf repository /data/repository/ -o rw,uid=1000,gid=1000
 exit 0

Make it executable and run the script.

 sudo chmod 755 /home/mount_core.sh
    
 /home/mount_core.sh

Check that your mapped source is now visible, and that it is owned by the user account
```
 ll /data/
```
Make sure the script runs when the virtual machine reboots

Create another script
```
 sudo nano /etc/rc.local
```
Copy the following into the file and press “CRTL-X” then “Y” to save and exit
```
 #!/bin/sh -e
 /home/mount_core.sh
 exit 0
```
Make the script executable
```
 sudo chmod +x /etc/rc.local
```
Create a bash script to create a location on your virtual machine that your application will be served from.
```
 sudo nano /home/reset_application.sh
```

Copy the contents below into the file

 #!/bin/bash
 if ([ "$1" == "" ])
 then
     echo "You must specify an application to setup/reset"
     exit 1
 fi
    
 STD_DOMAIN=$1
    
 if [ ! -d "/data/local" ]; then
      echo "CREATE /data/local"
      mkdir /data/local
 fi
    
 echo "SETUP $STD_DOMAIN"
    
 rm -rf /data/local/${STD_DOMAIN}
 mkdir /data/local/${STD_DOMAIN}
 mkdir /data/local/${STD_DOMAIN}/clientside
 mkdir /data/local/${STD_DOMAIN}/serverside
    
 ln -s /data/repository/${STD_DOMAIN}/domain /data/local/${STD_DOMAIN}/domain
 ln -s /data/repository/${STD_DOMAIN}/models /data/local/${STD_DOMAIN}/models
    
 ln -s /data/repository/${STD_DOMAIN}/clientside/angular.json /data/local/${STD_DOMAIN}/clientside/angular.json
 ln -s /data/repository/${STD_DOMAIN}/clientside/package.json /data/local/${STD_DOMAIN}/clientside/package.json
 ln -s /data/repository/${STD_DOMAIN}/clientside/tsconfig.json /data/local/${STD_DOMAIN}/clientside/tsconfig.json
 ln -s /data/repository/${STD_DOMAIN}/clientside/tslint.json /data/local/${STD_DOMAIN}/clientside/tslint.json
 ln -s /data/repository/${STD_DOMAIN}/clientside/src /data/local/${STD_DOMAIN}/clientside/src
    
 ln -s /data/repository/${STD_DOMAIN}/serverside/build.gradle /data/local/${STD_DOMAIN}/serverside/build.gradle
 ln -s /data/repository/${STD_DOMAIN}/serverside/docs /data/local/${STD_DOMAIN}/serverside/docs
 ln -s /data/repository/${STD_DOMAIN}/serverside/gradle.properties /data/local/${STD_DOMAIN}/serverside/gradle.properties
 ln -s /data/repository/${STD_DOMAIN}/serverside/settings.gradle /data/local/${STD_DOMAIN}/serverside/settings.gradle
 ln -s /data/repository/${STD_DOMAIN}/serverside/src /data/local/${STD_DOMAIN}/serverside/src
    
 echo "FINISHED SETUP"
    
 exit 0

Make the script executable

sudo chmod 755 /home/reset_application.sh

This script can now be run in the following manner to create a local application instance:
```
/home/reset_application.sh [projectname]
```

NB:0 For applications using SpringBot 0.3.0.0 or older, you will need to follow this guide so that your application is able to be served correctly.

Update

None! Every change made in the development environment is reflected in the server environment.

Option 2: Remote code editing over SSH using VS Code

This option is beneficial if you use Visual Studio Code (or VS Code) as your primary IDE for development. You can download the latest version of VS Code from the official website.

Setup

On server environment:

Create the directory /data/repository

 sudo mkdir /data
 cd /data
 sudo mkdir repository
 sudo chown user:user repository
 cd repository

Clone your repository (substituting in your git URL) and switch to the develop branch

 cd /data/repository/
 git clone https://git.codebots.com/cb[subdomain]/[project-slug].git
 cd [project-slug]
 git checkout develop

On development environment:

Install Plugin
1. Open VS Code, select the Extensions tab
2. Search for Remote - SSH and install the extension.
3. You should now see a Remote - SSH icon in the left hand tray of VS Code.
Setup Config
1. Click on the Remote - SSH icon and click on Configure a SSH Host
2. Select C:\Users\[You]\.ssh\config and add the following to the file. Press Ctrl > S for Windows or Cmd > S for Mac to save the config.
```
 Host springbot.vm
  User user
  HostName 192.168.56.101
```
Add a setting to your user preferences to prompt for a password.
1. Press Ctrl > Shift > P for Windows or Cmd > Shift > P for Mac to show all commands and type in “user” to find the “Preferences: Open User Settings” option.
2. In the top right hand corner, select the “Open Settings (JSON)” option. This will open the settings.json file.
3. Paste the following into the settings.json file.
```
 "remote.SSH.showLoginTerminal" : true,
```
4. Press Ctrl + S for Windows or Cmd + S for Mac to save, then close the file.
5. Restart VS Code
Connect
1. On the left tray you should now see springbot.vm. Hovering over it will present you an add folder icon.
2. Clicking this icon will open a new VS Code window. If this is the first time you have connected, you will see a warning and a prompt to continue. Type “yes” and press Enter.
3. You will be prompted to enter your password:
  This password prompt will appear twice.
4. Once you have logged in, you will see the a message confirming you are connected to the SSH host.
5. You will now be able to open a folder on your server to start editing code. In the Explorer tab in the top left, click on the “Open Folder” button, and navigate to /data/repository/[projectname]
6. You will need to login again, so follow the steps above (entering your password in twice).
7. You should now see your application open in the Explorer tab on the left. You can navigate through the folders, open and edit files and your changes will be reflected on the server.