How to Setup Visual Studio Code for Remote Development | Scribe

    How to Setup Visual Studio Code for Remote Development

    • Stanley Ndagi |
    • 45 steps |
    • 4 minutes

    Setting up vscode.dev

    1
    You don't need to have VSCode installed in your machine. You can use the online VSCode. In this tutorial, I'll show you how to do that. If you are using GitHub for your remote repositories using [[github.dev]] is a better process. It's good to know that you have this option, ideally for prototyping but it also supports remote repositories.
    2
    Navigate to [https://vscode.dev/](https://vscode.dev/)
    3
    Click here (user account icon).
    4
    Click "Turn on Cloud Changes..."
    5
    Click on your preferred account to sign in (GitHub or Microsoft). In this case, "Sign in with GitHub".
    6
    Click this icon, again, to confirm that you're signed in.
    7
    Since it reads that "You are not signed in to any accounts", reload the browser tab.
    8
    Click this icon, again, to confirm that you're signed in.
    9
    Great. You are if you can see the account name.\ In this case, **NdagiStanley (GitHub)**. Click on that. Then, click "Manage Trusted Extensions" to see whether your account has any.\ More on extensions below. Click "OK" or the 'x' icon to close that modal.
    Great. You are if you can see the account name.\ In this case, **NdagiStanley (GitHub)**. Click on that. Then, click "Manage Trusted Extensions" to see whether your account has any.\ More on extensions below. Click "OK" or the 'x' icon to close that modal.
    10
    Click "Turn on Settings Sync..." to sync your settings.
    11
    Click "Sign in & Turn on"
    12
    Click on your preferred account (GitHub or Microsoft) In this case, "... GitHub" (since I'm signed in already) > Note that: Settings Sync and Cloud Changes can be synced from different accounts
    13
    Click the icon, again.\ (Notice mine is on the left, since that's how I've configured my VSCode) You'll notice the checkmark next to "Settings Sync is On". Great!
    14
    Great. Your editor is ready.
    external-screenshot

    Editor options

    15
    Click here (hamburger icon) to view the menu.
    16
    Open the integrated terminal. Terminal Keyboard shortcuts?\ Press [[Ctrl]] + [[\\\`]] (For Windows or Linux) OR [[⌃]] +[[\\\`]] (For macOS)\ \ Refer to <https://code.visualstudio.com/shortcuts/keyboard-shortcuts-windows.pdf> , <https://code.visualstudio.com/shortcuts/keyboard-shortcuts-macos.pdf> and <https://code.visualstudio.com/shortcuts/keyboard-shortcuts-linux.pdf>
    17
    The terminal is not active on [[vscode.dev]] Click "Continue Working in GitHub Codespaces" to spin up a fully-configured development environment for this repository in the cloud with GitHub Codespaces.

    Opening a Remote Repository