The Emscripten SDK containing the Emscripten compiler can be downloaded here. On Linux and MacOS some dependencies need to be installed prior to installing the compiler, details of these and instructions for their installation can be found here but after those are dealt with the installlation of Emscripten itself is quite straightforward; if you’re using the portable SDK it’s a case of unzipping it in a convenient place, changing into the ‘emsdk_portable’ directory and running the following commands which fetch the latest online tools from the web, installs them, and makes them active:

./emsdk update 
./emsdk install latest
./emsdk activate latest

Linux and MacOS X require a further step to set the system path to the active version of Emscripten:

source ./emsdk_env.sh

If all this has worked as it should, you should have the Emscripten compiler, emcc, at the file path ./emscripten/master/emcc in the emsdk_portable directory you downloaded. You can add this to your system path, or just reference the whole path whenever you want to invoke the compiler.

To check that all this has proceeded as expected we need to write a short test program and compile it to JavaScript. The standard C implementation of the classic ‘Hello World’ program will do the trick nicely:

#include <stdio.h>

int main()
{
    printf("hello world!");
    return 0;
}

Compile with the Emscripten C compiler with the following command:

emcc hello_world.c -o hello_world.html

and you should get the files hello_world.html and hello_world.js appearing in your working directory. hello_world.js is the guts of your program, the JavaScript that your C program has been compiled into. The -o hello_world.html argument which was passed to emcc told emcc to also generate an HTML file, hello_world.html, which interfaces with the compiled JavaScript, including the JavaScript in an HTML document and also defining what should be done with the C program’s output. It’s possible to write this yourself, but we’ll concentrate on other things first, for now Emscripten’s way of dealing with output is fine, via a <textarea> element for text output and a <canvas> element for anything graphical we’ll be doing. If you open hello_world.html in your browser you should see the Emscripten HTML document with the words hello world! in the text area that’s been defined to handle stdout. I warn you, it’s pretty spectacular.