<commit_before># lein-figwheel

File Eval Gui Loop > FEGL > FEGUIL > "figwheel"

![Fig wheel on a drink](http://s3.amazonaws.com/bhauman-blog-images/Fig-Sidecar_Pomegranate-Bistro1-1.jpg)

#### Still a work in progress. But that doesn't mean it's not a cool garnish.

A Leiningen plugin that builds your ClojureScript and pushes the
changes to the browser.

See the introductory blog post [here](http://rigsomelight.com/2014/05/01/interactive-programming-flappy-bird-clojurescript.html).

If you write reloadable code, figwheel can facilitate automated live
interactive programming. Every time you save your ClojureScript source
file the changes are sent to the browser so you can see the affects of
modifying your code in real time.  This is different than interactive
programming in the browser-repl where you need to cherry pick which
changes to send and which processes to start, etc.

The inclusion of a **static file server** allows you to get a decent
ClojureScript development environment up and running quickly.

Figwheel's connection is fairly robust. I have experienced figwheel
sessions that have lasted for days through multiple OS sleeps. You can
also use figwheel like a Repl if you are OK with using `print` to output
the evaluation results to the browser console.

Figwheel also has **live CSS reloading**.

Figwheel **broadcasts** changes to all connected clients. This means you
can see code and CSS changes take place in real time on your phone and
in your laptop browser simultaneously. The broadcast of live code
updates can have interesting applications. You could have a whole
classroom directly interacting with a game that is being worked on
live from the front of the room or even remotely.

## Demo

Here is a [live demo of using figwheel](https://www.youtube.com/watch?v=KZjFVdU8VLI)

### What actually happens

This plugin starts the cljsbuild auto builder, opens a websocket and
starts static file server. When you save a ClojureScript file,
cljsbuild will detect that and compile it and other affected files. It
will then pass a list those changed files off to the figwheel server.
The figwheel server will in turn push the paths of the **relevant**
compiled javascript files through a websocket so that the browser can
reload them.

There is also a figwheel client that you need to include into your
ClojreScript project to start a process which listens for changes and
reloads the files.

The main motivation for lein-figwheel is to allow for the interactive
development of ClojureScript. Figwheel doesn't provide this out of the
box, the developer has to take care to make their code reloadable. 

If you are using React or Om it's not hard to write reloadable code,
in fact you might already be doing it.

## Quick Start

Make sure you have the [latest version of leinigen installed](https://github.com/technomancy/leiningen#installation).

You can get started quickly with the flappy bird demo:

    git clone https://github.com/bhauman/flappy-bird-demo.git

then cd into `flappy-bird-demo` and type

    lein figwheel

You can now goto `localhost:3449/index.html` and open up
`src/flappy_bird_demo/core.cljs` with your favorite editor and start
coding. Make sure you open your browser's development console so you
can get feedback about code reloads.

If you would prefer to greenfield a new project you can use the
figwheel leinigen template.

    lein new figwheel hello-world

## Usage

First make sure you include the following `:dependencies` in your `project.clj` file.

```clojure
[org.clojure/clojurescript "0.0-2197"] ;; has to be at least 2197 or greater
[figwheel "0.1.2-SNAPSHOT"]            ;; needed for figwheel client
```

Then include `lein-figwheel` along with `lein-cljsbuild` in the `:plugins`
section of your project.clj.

```clojure
[lein-cljsbuild "1.0.3"] ;; 1.0.3 is a requirement
[lein-figwheel "0.1.2-SNAPSHOT"]
```

You also need to have your `lein-cljsbuild` configuration set up in your
`project.clj`.

Here is an example:

```clojure
:cljsbuild {
  { :builds [ { :id "example" 
                :source-paths ["src/"]
                :compiler { :output-to "resources/public/js/compiled/example.js"
                            :output-dir "resources/public/js/compiled/out"
                            :externs ["resources/public/js/externs/jquery-1.9.js"]
                            :optimizations :none
                            :source-map true } } ] } 
}
```

The important part here is that you have to have at least one `build`
and that build has to have `:optimizations` set to `:none`.
<commit_msg>updating readme to reflect light table compatible release<commit_after># lein-figwheel

File Eval Gui Loop > FEGL > FEGUIL > "figwheel"

![Fig wheel on a drink](http://s3.amazonaws.com/bhauman-blog-images/Fig-Sidecar_Pomegranate-Bistro1-1.jpg)

#### Still a work in progress. But that doesn't mean it's not a cool garnish.

A Leiningen plugin that builds your ClojureScript and pushes the
changes to the browser.

See the introductory blog post [here](http://rigsomelight.com/2014/05/01/interactive-programming-flappy-bird-clojurescript.html).

If you write reloadable code, figwheel can facilitate automated live
interactive programming. Every time you save your ClojureScript source
file the changes are sent to the browser so you can see the affects of
modifying your code in real time.  This is different than interactive
programming in the browser-repl where you need to cherry pick which
changes to send and which processes to start, etc.

The inclusion of a **static file server** allows you to get a decent
ClojureScript development environment up and running quickly.

Figwheel's connection is fairly robust. I have experienced figwheel
sessions that have lasted for days through multiple OS sleeps. You can
also use figwheel like a Repl if you are OK with using `print` to output
the evaluation results to the browser console.

Figwheel also has **live CSS reloading**.

Figwheel **broadcasts** changes to all connected clients. This means you
can see code and CSS changes take place in real time on your phone and
in your laptop browser simultaneously. The broadcast of live code
updates can have interesting applications. You could have a whole
classroom directly interacting with a game that is being worked on
live from the front of the room or even remotely.

## Demo

Here is a [live demo of using figwheel](https://www.youtube.com/watch?v=KZjFVdU8VLI)

### What actually happens

This plugin starts the cljsbuild auto builder, opens a websocket and
starts static file server. When you save a ClojureScript file,
cljsbuild will detect that and compile it and other affected files. It
will then pass a list those changed files off to the figwheel server.
The figwheel server will in turn push the paths of the **relevant**
compiled javascript files through a websocket so that the browser can
reload them.

There is also a figwheel client that you need to include into your
ClojreScript project to start a process which listens for changes and
reloads the files.

The main motivation for lein-figwheel is to allow for the interactive
development of ClojureScript. Figwheel doesn't provide this out of the
box, the developer has to take care to make their code reloadable. 

If you are using React or Om it's not hard to write reloadable code,
in fact you might already be doing it.

## Quick Start

Make sure you have the [latest version of leinigen installed](https://github.com/technomancy/leiningen#installation).

You can get started quickly with the flappy bird demo:

    git clone https://github.com/bhauman/flappy-bird-demo.git

then cd into `flappy-bird-demo` and type

    lein figwheel

You can now goto `localhost:3449/index.html` and open up
`src/flappy_bird_demo/core.cljs` with your favorite editor and start
coding. Make sure you open your browser's development console so you
can get feedback about code reloads.

If you would prefer to greenfield a new project you can use the
figwheel leinigen template.

    lein new figwheel hello-world

## Usage

#### For ClojureScript > 0.0-2197

First make sure you include the following `:dependencies` in your `project.clj` file.

```clojure
[org.clojure/clojurescript "0.0-2197"] ;; has to be at least 2197 or greater
[figwheel "0.1.2-SNAPSHOT"]            ;; needed for figwheel client
```

Then include `lein-figwheel` along with `lein-cljsbuild` in the `:plugins`
section of your project.clj.

```clojure
[lein-cljsbuild "1.0.3"] ;; 1.0.3 is a requirement
[lein-figwheel "0.1.2-SNAPSHOT"]
```

#### For ClojureScript 0.0-2014 - 0.0-2173

For now this is needed for Light Table compatability:

First make sure you include the following `:dependencies` in your `project.clj` file.

```clojure
[org.clojure/clojurescript "0.0-2173"] ;; has to be between 2014 - 2197
[figwheel "0.1.2-2173-SNAPSHOT"]            ;; needed for figwheel client
```

Then include `lein-figwheel` along with `lein-cljsbuild` in the `:plugins`
section of your project.clj.

```clojure
[lein-cljsbuild "1.0.2"] ;; 1.0.2 is a requirement
[lein-figwheel "0.1.2-2173-SNAPSHOT"]
```

#### Configure lein cljsbuild

You also need to have your `lein-cljsbuild` configuration set up in your
`project.clj`.

Here is an example:

```clojure
:cljsbuild {
  { :builds [ { :id "example" 
                :source-paths ["src/"]
                :compiler { :output-to "resources/public/js/compiled/example.js"
                            :output-dir "resources/public/js/compiled/out"
                            :externs ["resources/public/js/externs/jquery-1.9.js"]
                            :optimizations :none
                            :source-map true } } ] } 
}
```

The important part here is that you have to have at least one `build`
and that build has to have `:optimizations` set to `:none`.

{'fraction_non_alphanumeric': 0.07310120138464671, 'fraction_numerical': 0.013439218081857055, 'mean_word_length': 3.7316955684007707, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 10, 'https://': 6, 'lorem ipsum': 0, 'www.': 2, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '2689033', 'n_tokens_mistral': 2944, 'n_tokens_neox': 2759, 'n_words': 1293}