notes on code-server + iPad + C and Makefiles

Config.md

Notes on Configuring for C Development

These notes are fairly surface-level as I'm finding this solution inadequate for my use case. But I'll leave up what little I have learned so hopefully it'll save the reader some time.

Way Back Home

First thing to note: you can open a terminal at any time, so you're not handcuffed to the GUI. One way is to right click on a folder and click "open in integrated terminal". This is the same terminal environment you start your server in. YMMV how usable this terminal actually is for things like copy and paste, etc.

Fun fact: any changes made on the filesystem will be reflected in the code-server interface and editor.

Launches and Tasks

When you open a project, a .vscode directory will be created. This directory has a few useful project-specific settings files.

tasks.json lets you specify tasks to be run -- compilation, linting, the build system, etc. [Introduction to tasks]

An example tasks.json file for cosmo:

{
    // See https://go.microsoft.com/fwlink/?LinkId=733558
    // for the documentation about the tasks.json format
    "version": "2.0.0",
    "tasks": [
        {
            "label": "make MODE=dbg",
            "type": "shell",
            "command": "make all ${config:makeJobs} MODE=dbg -O",
            "presentation": {
                "reveal": "always"
            },
            "group": {
                "kind": "build",
                "isDefault": true
            }
        }
    ]
}

Note the ${config:makeJobs}. tasks.json supports limited variable substitution. In this case, it's referring to a variable in the settings.json file:

{
    "makeJobs": "-j8",
}

I could put this variable in my application-wide settings as well at ~/.local/share/code-server/User/settings.json.

launches.json lets you specify executables to be run and (usually) debugged. [Configuring launch.json for C/C++ debugging]

{
    // Use IntelliSense to learn about possible attributes.
    // Hover to view descriptions of existing attributes.
    // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
    "version": "0.2.0",
    "configurations": [
        {
            "name": "hello.com",
            "type": "gdb",
            "request": "launch",
            "target": "./o/dbg/examples/hello.com.dbg",
            "cwd": "${workspaceRoot}",
            "valuesFormatting": "parseText"
        }
    ]
}

(This debugging experience is pretty neat when you're used to just gdb.)

the Makefile Tools extension

VScode has lots of integrations for Node, Ruby, C#, and other modern languages. Unfortunately I am allergic to modernity and was left wanting for a non-allergenic substitute. I wanted make jobs integrated into the environment, and ms-vscode.makefile-tools is the only solution I found. Unfortunately this addon isn't very reliable. It can get (millions of) build targets adequately by reading the makefile. However, to get launch targets (a pretty convenient feature to build and run executables in one go) it depends on parsing the output of make. As of April 2022 this parsing can get thrown off by:

• multiple jobs through -j
• jobs changing directories, resulting in different relative paths
• silencing the output beyond what V=1 shows
• shell commands including subshells through backticks `foo` (but not ${foo} apparently)

For more, see this article.

I was never able to get cosmo's build targets to appear. If you're struggling as well, try using make with V=1 --output-sync=recurse, and if really necessary -j1.

Regarding addons

The official vscode marketplace isn't actually what code-server uses, instead choosing to integrate addons from OpenVSX.

Install.md

Local Install and Setup of code-server

Installation

NOTE: If you're fine with paying money for this service, you can rent a cloud environment at GitHub Codespaces and skip this part.

code-server is pretty self-contained (compared to most web apps at least).

First get node and NPM. I like to use NVM so it needs no OS-level install at all, though that has the downside of needing to activate nvm before running any apps that need it.

Then install code-server. You really just need to do this:

curl -fsSL https://code-server.dev/install.sh | sh

The app is now neatly nestled in ~/.local/bin, be sure it's on your path.

Config

The config file can be found at ~/.config/code-server/ in config.yaml. These are the same as the CLI flags, i.e.

• bind-addr: 127.0.0.1:8080 == $ code-server --bind-addr "127.0.0.1:8080"
• cert: true == $ code-server --cert.

(If a tutorial talks about settings.json, they're referring to project-specific VSCode settings and not this. 😊)

First up is bind-addr, if you want it to be accessible outside of your local machine you can change it to 0.0.0.0. Note that this app isn't considered secure for public-facing deployment. Authenticated reverse proxies are the popular solution.

Next is authentication. It makes a randomly-generated password by default. You can change the password, or delete the password: field and change auth: none. If you don't want a password stored in plaintext, you can use hashed-password: with an argon2 hash (this may be installed on your system already).

If you'll only access the machine locally, you could look at replacing bind-addr with a Unix socket via socket: (path) and socket-mode: (chmod) options. Not sure how this interacts with self-signed SSL certificates though, it's probably designed for reverse proxies.

Let's talk certs. You need a cert for certain features to function correctly (which features break are chosen arbitrarily by Moloch). All the tutorials will tell you that self-signed certificates are broken on iPad. This isn't quite true: the self-generated certificates that code-server natively generates are broken on iPad.

To generate one of these broken certificates, just change cert: true and it'll be made on startup. It probably works on non-iPads fine, I haven't checked.

To use a self-generated cert that works, just make it yourself:

cd ~/.config/code-server
openssl req -newkey rsa:4096  -x509  -sha512  -days 365 -nodes -out certificate.pem -keyout privatekey.pem

This will interactively prompt you for details. Enter your hostname as appropriate. IP addresses will work.

Then change your config like this:

cert: /home/user/.config/code-server/certificate.pem
cert-key: /home/user/.config/code-server/privatekey.pem

Now it'll load with SSL.

While you're here, you can add your GitHub token with github-auth:

For privacy nuts, disable-telemetry: true. Also, why are you using this?

For more about securely hosting code-server, see this section of the docs.

Use

Now when you want a code-server, just run code-server /path/to/project, then open it in your browser. If your browser is local you can use --open to get a window immediately. code-server can also be used without specifically tying it to a project by just not providing a file path. It can then browse directories and clone new repositories as you like.

iPad-specific notes

I don't have much to add, except read this and be warned that the app will regularly forget your login, so you may want to consider restricting the code-server to 127.0.0.1, disabling the password and using port forwarding with the fantastic app Blink.sh.

The menu bar is inaccessible from the touchscreen, keep it disabled and use the left side "hamburger button" instead.

Sometimes I find the onscreen keyboard simply breaks and will no longer show, in this case you'll need to re-make the PWA (homescreen app).