1^st Practical Class:
Hello, Server!

(how to connect to 4IT580 server)

Connect to Server Using SSH

• You will need SSH client
  • on Windows: use PuTTY
  • on macOS/Linux: use your favorite terminal
    • on macOS you can use macOS Terminal.app or iTerm2

Connect to SSH

• on Windows:

  • open PuTTY

    

  • In Host Name (or IP address) enter: vse.handson.pro

  • Press Open button

  • You will be asked about username and password

    • use SSH credential you have received in email from us

• on macOS/Linux:

  • Open your terminal.

  • Enter (replace USERNAME with your username):

    

  • You will be asked about password

    • use SSH credential you have received in email from us

Initial Project Installation

• connect to server using SSH

• run following commands:

• open: http://dev.frontend.USERNAME.vse.handson.pro/

  • replace USERNAME with your username

VS Code editor

We suggest using VS Code editor.

You can use any editor you like, but:

• you should be able to edit remote files over SSH/SFTP,
• it should support modern JavaScript (ES2015+) and JSX syntax.

Download VS Code

• Go to code.visualstudio.com and download the latest version
• Run VS Code and go to Extensions (Ctrl+Shift+X ,⇧⌘P) in the left panel
• Search for and install recommended packages Recommended VS Code Packages.

Recommended VS Code Packages

• Please install following VS COde package:
  • ESLint
  • Prettier
  • GitLens
  • SSH FS

Setup SSH connection from VS Code to you remote space

• Make sure to have supported SSH client installed (it'll be used by VS Code to connect to the remote host)

  • MacOS should have it by default in terminal
  • For Windows, PuTTY is not supported by VS Code, use Windows OpenSSH Client instead
    (you can still use PuTTY for accessing the SSH host via terminal)

• In VS Code, select SSH FS: Create a SSH FS configuration from the command palette (F1, ⇧⌘P)

• fill this:

  • Name: USERNAME@vse.handson.pro (change USERNAME for your username)
  • Location: Global settings.json

• click Save

• new screen is presented, set following settings:

  • Host: vse.handson.pro
  • Root: ~/code/cviceni
  • Username: USERNAME (use your username)
  • Password: select <Prompt> (or type in your SSH password, if you want to save it in VS Code)

• scroll down and click Save

• in left side of VS Code select SSH FS plugin, and select Add as Workspace folder icon next to your configuration. See screenshot:

• it will ask you for password (maybe two times) and you can edit the project as usual

Run Frontend on Your Local Machine (optional)

Requirements

• Git
  • use of command line tool is suggested
• Node.js v16.17.0
  • use of nvm - Node Version Manager or nvm-windows is suggested
    • this allows simple management of multiple Node.js versions on your computer
    • to install 16.17.0 run nvm install 16.17.0
    • to use 16.17.0 run nvm use 16.17.0 (this may be required each time you start new Terminal session)
  • if nvm is not your cup of tea, you can download it directly from Node.js v16.17.0 site
• Yarn v1 (there may be some issues with Yarn v2/v3 - it has not been tested)
  • after you install Node.js you can run this co install Yarn v1:

Clone Git Repo

Open Terminal or Command line and type: