/frontend

CircleCI's frontend

Primary LanguageClojureEclipse Public License 1.0EPL-1.0

CircleCI's frontend

Circle CI

This is an open-source mirror of the code that is running CircleCI's frontend. CircleCI provides powerful Continuous Integration and Deployment with easy setup and maintenance.

Feel free to fork and make contributions. We'll try to get them into the main application.

Want to work with Clojure(Script) full-time? We're hiring.

Dependencies and Setup

Submodules

The frontend uses some git submodules that you need to checkout:

git submodule update --init

Node.js

Install Node.js and node dependencies:

npm install

Download all of the 3rd-party javascript dependencies:

node_modules/.bin/bower install

Clojure

Install Leiningen.

Hosts

In your /etc/hosts, add the following line:

127.0.0.1 prod.circlehost

If you have access to the backend code, you can also add this line:

127.0.0.1 dev.circlehost

Usage

Development Processes

Two processes must be running while you work.

First, start the HTTP server that will serve the compiled assets on port 3000:

lein run

Second, the frontend clojurescript asset compiler:

lein figwheel dev

Running the Karma Tests

You can run the tests locally with

node_modules/karma/bin/karma start karma.dev.conf.js --single-run

If you have karma-cli installed globally, you can say

karma start karma.dev.conf.js --single-run

instead.

Alternatively, you can leave a karma process running (karma start karma.dev.conf.js) and connect to it and run the tests with karma run.

Adding Tests

Take a look at test-cljs/frontend/sample_test.cljs for a starting point. Save a copy to the appropriate path for the namespace you want to test.

Karma won't automatically require the test namespaces, so open test-js/require-karma.js and add a require statement. Now the ns tests should run with every karma invocation.

Asset Compilation Errors

If you are experiencing errors when building assets the following commands may help reset all cached state:

lein clean
lein cljsbuild once

Sanity Check

To test that everything worked, visit http://prod.circlehost:3000/assets/css/app.css and http://prod.circlehost:3000/assets/js/om-dev.js.stefon in your browser.

Production & Development Backends

Now you should have everything you need to start hacking on Circle's frontend!

Visit http://prod.circlehost:3000?om-build-id=dev for the a production backend with locally build development assets. Again, if you've got access to the backend code (NOTE: it's not open source), you can run it locally on circlehost:8080. To connect to the development backend, visit http://dev.circlehost:3000. The dev server will default to dev assets, so you don't need the query parameter.

NOTE: login and logout will invalidate the session, so you'll need to use the ?om-build-id=dev query parameter again. This will be fixed soon.

Browser REPL

From a Clojure REPL:

(cemerick.piggieback/cljs-repl :repl-env (frontend.core/cljs-repl-env))

Via vim-fireplace:

:Piggieback (frontend.core/cljs-repl-env)