1st 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:

  • 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 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: https://dev-frontend--vse.handson.pro/

  • replace 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: (change for your username)
  • Location:

• click Save

• new screen is presented, set following settings:

  • Host:
  • Root:
  • Username: (use your username)
  • Password: select (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 v20
  • use of nvm - Node Version Manager, nvm-windows or Fast Node Manager is suggested
    • this allows simple management of multiple Node.js versions on your computer
    • to install 20.14 run
    • to use 20.14 run (this may be required each time you start new Terminal session)
    • to use version defined in run
  • if is not your cup of tea, you can download it directly from Node.js 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 to use Yarn v1:

Clone Git Repo

Open Terminal or Command line and type: