diff --git a/.gitignore b/.gitignore
index 43ed93388a..c824840200 100644
--- a/.gitignore
+++ b/.gitignore
@@ -5,6 +5,7 @@
 /build/ol3-api.js
 /build/ol3-compiled.js
 /demos/*/advanced-optimizations.*
+/demos/*/build.html
 /demos/*/debug.html
 /demos/*/simple-optimizations.*
 /doc/apidocs/
diff --git a/Makefile b/Makefile
index bd57db5f09..a541419f9a 100644
--- a/Makefile
+++ b/Makefile
@@ -28,7 +28,19 @@ build/ol3.js: $(SRC)
 	( echo "goog.require('goog.dom');" ; find src/ol -name \*.js | xargs grep -rh ^goog.provide | sort | uniq | sed -e 's/provide/require/g' ) > $@
 
 .PHONY: demos
-demos: demos/side-by-side
+demos: demos/api1 demos/side-by-side
+
+.PHONY: demos/api1
+demos/api1: \
+	build/ol3-api.js \
+	demos/api1/build.html \
+	demos/api1/debug.html
+
+demos/api1/build.html: demos/api1/index.html.in
+	sed -e 's|@SRC@|../../build/ol3-api.js|' $< > $@
+
+demos/api1/debug.html: demos/api1/index.html.in
+	sed -e 's|@SRC@|http://localhost:9810/compile?id=ol3-api|' $< > $@
 
 .PHONY: demos/side-by-side
 demos/side-by-side: \
diff --git a/demos/api1/api1.js b/demos/api1/api1.js
new file mode 100644
index 0000000000..0e3259e5fd
--- /dev/null
+++ b/demos/api1/api1.js
@@ -0,0 +1,6 @@
+var map = ol3.map({
+  renderTo: 'map',
+  layers: [ol3.layer.osm()],
+  center: [45, 5],
+  zoom: 10
+});
diff --git a/demos/api1/index.html.in b/demos/api1/index.html.in
new file mode 100644
index 0000000000..c2b0b0fa81
--- /dev/null
+++ b/demos/api1/index.html.in
@@ -0,0 +1,19 @@
+<!doctype html>
+<html>
+    <head>
+        <style type="text/css">
+            .map {
+                width: 400px;
+                height: 400px;
+                border: thin solid;
+            }
+        </style>
+        <script src="@SRC@" type="text/javascript"></script>
+        <title>ol3 api1 demo</title>
+    </head>
+    <body>
+        <h1>ol3 api1 demo</h1>
+        <div class="map" id="map"></div>
+        <script src="api1.js" type="text/javascript"></script>
+    </body>
+</html>
