Since more to than 2 years I’ve build Meteor applications. Interestingly I’ve build most of them only using the client part. Working with TunedIn we used a LAMPP stack API, and in my current work I use Meteor to build Ðapps, which don’t have a server in the traditional sense, instead they only talk to the blockchain and get delivered over swarm, a decentralised filesystem.

I wrote a while back about using Meteor as frontend library and wrote a little grunt script, which did this. My blog post got more than 3000 hits in just two days, so there seems to be a great interest in that use case.

A few months later i started to ask this question in the Meteor-Core google group, but didn’t got to much response from MDG, though a lot of people still seemed to need that too.

Later a few people created the MeteorCommunity github repository to discuss community wishes, where they put my request as one of the first ones.

Now that I need to be able to simply deploy Meteor Ðapps for the ethereum platform I created a simple CLI tool, which does what I always needed 🙂

$ meteor-build-client

This tool builds and bundles the client part of a Meteor app with a simple index.html, so it can be hosted on any server or even loaded via the file:// protocol.

You can check the source here: http://github.com/frozeman/meteor-build-client

Note: The meteor package frozeman:build-client is only a placeholder package for now, don’t install it.

Installation

$ [sudo] npm install -g meteor-build-client

Usage

// cd into your meteor app $ cd myApp // run meteor-build-client $ meteor-build-client ../myOutputFolder

Output

The content of the output folder could look as follows:

index.html

a28817fe16898311635fa73b959979157e830a31.css

aeca2a21c383327235a08d55994243a9f478ed57.js

... (other files from your “public” folder)

For a list of options see:

$ meteor-build-client --help

Passing a settings.json

You can pass an additional settings file using the --settings or -s option:

$ meteor-build-client ../myOutputFolder -s ../settings.json

Note Only the public property of that JSON file will be add to the Meteor.settings property.

App URL

Additionally you can set the ROOT_URL of your app using the --url or -u option:

$ meteor-build-client ../myOutputFolder -u http://myserver.com

Absolute or relative paths

If you want to be able to start you app by simply opening the index.html (using the file:// protocol), you need to link your files relative. You can do this by setting the --path or -p option:

$ meteor-build-client ../myOutputFolder -p ""

The default path value is "/" .

Note When set a path value, it will also replace this path in you Meteor CSS file, so that fonts etc link correctly.

Using custom templates

If you want to provide a custom template for the initial HTML provide an HTML file with the --template or -t option:

$ meteor-build-client ../myOutputFolder -t ../myTemplate.html

The template file need to contain the following placholders: {{> head}} , {{> css}} and {{> scripts}} . The following example adds a simple loading text to the initial HTML file (Your app should later take care of removing the loading text):

<!DOCTYPE html> <html> <head> {{> head}} <link rel="stylesheet" type="text/css" href="/loadingScreen.css"> </head> <body> <h1>Loading...</h1> {{> css}} {{> scripts}} </body> </html>

By linking a file from your public folder (e.g. loadingScreen.css ) and moving the {{> css}} and {{> scripts}} placeholder to the end of the <body> tag, you can simply style your loading screen. Because the small CSS file ( loadingScreen.css ) and the body content will be loaded before the Meteor app script, the the user sees the nice Loading text.

Connecting to a Meteor server

In order to connect to a Meteor servers, create DDP connection by using DDP.connect() , as seen in the following example: