diff --git a/.circleci/config.yml b/.circleci/config.yml
index c02a33b2a..2388fb4f8 100644
--- a/.circleci/config.yml
+++ b/.circleci/config.yml
@@ -97,7 +97,7 @@ jobs:
       - run: *run_yarn_install
       - save_cache: *save_yarn_cache
       - build_app:
-          template: 'Autocomplete.js'
+          template: 'Autocomplete.js 0'
           app: 'autocomplete.js'
       - build_app:
           template: 'InstantSearch.js'
@@ -127,8 +127,11 @@ jobs:
           template: 'Angular InstantSearch'
           app: 'angular-instantsearch'
       - build_app:
-          template: 'Autocomplete.js'
+          template: 'Autocomplete.js 0'
           app: 'autocomplete.js'
+      - build_app:
+          template: 'Autocomplete'
+          app: 'autocomplete'
       - build_app:
           template: 'InstantSearch.js'
           app: 'instantsearch.js'
diff --git a/.nvmrc b/.nvmrc
index 5c088ddb9..c10742477 100644
--- a/.nvmrc
+++ b/.nvmrc
@@ -1 +1 @@
-12.14.1
+14.15.0
diff --git a/src/templates/Autocomplete.js/favicon.png b/e2e/__image_snapshots__/autocomplete.js-0.x/favicon.png-snap.png
similarity index 100%
rename from src/templates/Autocomplete.js/favicon.png
rename to e2e/__image_snapshots__/autocomplete.js-0.x/favicon.png-snap.png
diff --git a/e2e/__image_snapshots__/autocomplete/favicon.png-snap.png b/e2e/__image_snapshots__/autocomplete/favicon.png-snap.png
new file mode 100644
index 000000000..084fdfdfc
Binary files /dev/null and b/e2e/__image_snapshots__/autocomplete/favicon.png-snap.png differ
diff --git a/e2e/__snapshots__/templates.test.js.snap b/e2e/__snapshots__/templates.test.js.snap
index fe763656d..6ce5600c9 100644
--- a/e2e/__snapshots__/templates.test.js.snap
+++ b/e2e/__snapshots__/templates.test.js.snap
@@ -672,7 +672,7 @@ Array [
 ]
 `;
 
-exports[`Templates Autocomplete.js File content: .editorconfig 1`] = `
+exports[`Templates Autocomplete File content: .editorconfig 1`] = `
 "root = true
 
 [*]
@@ -684,19 +684,274 @@ insert_final_newline = true
 trim_trailing_whitespace = true"
 `;
 
-exports[`Templates Autocomplete.js File content: .eslintignore 1`] = `
+exports[`Templates Autocomplete File content: .eslintignore 1`] = `
 "/node_modules
 /dist
 /.cache"
 `;
 
-exports[`Templates Autocomplete.js File content: .eslintrc.js 1`] = `
+exports[`Templates Autocomplete File content: .eslintrc.js 1`] = `
+"/* eslint-disable import/no-commonjs */
+
+module.exports = {
+  extends: ['algolia', 'algolia/react'],
+  settings: {
+    react: {
+      pragma: 'React',
+      version: 'preact',
+    },
+  },
+  rules: {
+    'jsdoc/check-tag-names': [
+      'error',
+      {
+        jsxTags: true,
+      },
+    ],
+    'react/jsx-filename-extension': 'off',
+  },
+};"
+`;
+
+exports[`Templates Autocomplete File content: .gitignore 1`] = `
+"# See https://help.github.com/ignore-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+
+# testing
+/coverage
+
+# production
+/dist
+/.cache
+
+# misc
+.DS_Store
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*"
+`;
+
+exports[`Templates Autocomplete File content: .prettierrc 1`] = `
+"{
+  \\"singleQuote\\": true,
+  \\"proseWrap\\": \\"never\\",
+  \\"trailingComma\\": \\"es5\\"
+}"
+`;
+
+exports[`Templates Autocomplete File content: README.md 1`] = `
+"# autocomplete-app
+
+_This project was generated with [create-instantsearch-app](https://github.com/algolia/create-instantsearch-app) by [Algolia](https://algolia.com)._
+
+## Get started
+
+To run this project locally, install the dependencies and run the local server:
+
+\`\`\`sh
+npm install
+npm start
+\`\`\`
+
+Alternatively, you may use [Yarn](https://http://yarnpkg.com/):
+
+\`\`\`sh
+yarn
+yarn start
+\`\`\`
+
+Open http://localhost:3000 to see your app."
+`;
+
+exports[`Templates Autocomplete File content: app.js 1`] = `
+"/** @jsx h */
+import { autocomplete, getAlgoliaResults } from '@algolia/autocomplete-js';
+import algoliasearch from 'algoliasearch';
+import { h } from 'preact';
+
+import '@algolia/autocomplete-theme-classic';
+
+const searchClient = algoliasearch('appId', 'apiKey');
+
+autocomplete({
+  container: '#autocomplete',
+  placeholder: '',
+  debug: true,
+  getSources({ query }) {
+    return [
+      {
+        sourceId: 'items',
+        getItems() {
+          return getAlgoliaResults({
+            searchClient,
+            queries: [
+              {
+                indexName: 'indexName',
+                query,
+              },
+            ],
+          });
+        },
+        templates: {
+          item({ item, components }) {
+            return (
+              <div className=\\"aa-ItemWrapper\\">
+                <div className=\\"aa-ItemContent\\">
+                  <div className=\\"aa-ItemContentBody\\">
+                    <div className=\\"aa-ItemContentTitle\\">
+                      <components.Highlight
+                        hit={item}
+                        attribute=\\"attribute1\\"
+                      />
+                    </div>
+                  </div>
+                </div>
+              </div>
+            );
+          },
+          noResults() {
+            return 'No matching items.';
+          },
+        },
+      },
+    ];
+  },
+});"
+`;
+
+exports[`Templates Autocomplete File content: index.html 1`] = `
+"<html lang=\\"en\\">
+  <head>
+    <meta charset=\\"UTF-8\\" />
+    <meta name=\\"viewport\\" content=\\"width=device-width, initial-scale=1.0\\" />
+
+    <link rel=\\"shortcut icon\\" href=\\"favicon.png\\" type=\\"image/x-icon\\" />
+    <link rel=\\"stylesheet\\" href=\\"style.css\\" />
+
+    <title>autocomplete-app</title>
+  </head>
+
+  <body>
+    <div class=\\"container\\">
+      <div id=\\"autocomplete\\"></div>
+    </div>
+
+    <script src=\\"app.js\\"></script>
+  </body>
+</html>"
+`;
+
+exports[`Templates Autocomplete File content: manifest.webmanifest 1`] = `
+"{
+  \\"short_name\\": \\"autocomplete-app\\",
+  \\"name\\": \\"autocomplete-app Sample\\",
+  \\"icons\\": [
+    {
+      \\"src\\": \\"favicon.png\\",
+      \\"sizes\\": \\"64x64 32x32 24x24 16x16\\",
+      \\"type\\": \\"image/x-icon\\"
+    }
+  ],
+  \\"start_url\\": \\"./index.html\\",
+  \\"display\\": \\"standalone\\",
+  \\"theme_color\\": \\"#000000\\",
+  \\"background_color\\": \\"#ffffff\\"
+}"
+`;
+
+exports[`Templates Autocomplete File content: package.json 1`] = `
+"{
+  \\"name\\": \\"autocomplete-app\\",
+  \\"version\\": \\"1.0.0\\",
+  \\"private\\": true,
+  \\"scripts\\": {
+    \\"build\\": \\"parcel build index.html\\",
+    \\"start\\": \\"parcel index.html --port 3000\\",
+    \\"lint\\": \\"eslint .\\"
+  },
+  \\"keywords\\": [
+    \\"algolia\\",
+    \\"autocomplete\\",
+    \\"javascript\\"
+  ],
+  \\"partialDependencies\\": {
+    \\"@algolia/autocomplete-js\\": \\"1.0.0\\"
+  }
+}"
+`;
+
+exports[`Templates Autocomplete File content: style.css 1`] = `
+"* {
+  box-sizing: border-box;
+}
+
+body {
+  background-color: rgb(244, 244, 249);
+  color: rgb(65, 65, 65);
+  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
+    'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
+    sans-serif;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  padding: 1rem;
+}
+
+.container {
+  margin: 0 auto;
+  max-width: 640px;
+  width: 100%;
+}"
+`;
+
+exports[`Templates Autocomplete Folder structure: contains the right files 1`] = `
+Array [
+  ".editorconfig",
+  ".eslintignore",
+  ".eslintrc.js",
+  ".gitignore",
+  ".prettierrc",
+  "README.md",
+  "app.js",
+  "favicon.png",
+  "index.html",
+  "manifest.webmanifest",
+  "package.json",
+  "style.css",
+]
+`;
+
+exports[`Templates Autocomplete.js 0 File content: .editorconfig 1`] = `
+"root = true
+
+[*]
+charset = utf-8
+indent_style = space
+indent_size = 2
+end_of_line = lf
+insert_final_newline = true
+trim_trailing_whitespace = true"
+`;
+
+exports[`Templates Autocomplete.js 0 File content: .eslintignore 1`] = `
+"/node_modules
+/dist
+/.cache"
+`;
+
+exports[`Templates Autocomplete.js 0 File content: .eslintrc.js 1`] = `
 "module.exports = {
   extends: 'algolia',
 };"
 `;
 
-exports[`Templates Autocomplete.js File content: .gitignore 1`] = `
+exports[`Templates Autocomplete.js 0 File content: .gitignore 1`] = `
 "# See https://help.github.com/ignore-files/ for more about ignoring files.
 
 # dependencies
@@ -721,7 +976,7 @@ yarn-debug.log*
 yarn-error.log*"
 `;
 
-exports[`Templates Autocomplete.js File content: .prettierrc 1`] = `
+exports[`Templates Autocomplete.js 0 File content: .prettierrc 1`] = `
 "{
   \\"singleQuote\\": true,
   \\"proseWrap\\": \\"never\\",
@@ -729,7 +984,7 @@ exports[`Templates Autocomplete.js File content: .prettierrc 1`] = `
 }"
 `;
 
-exports[`Templates Autocomplete.js File content: README.md 1`] = `
+exports[`Templates Autocomplete.js 0 File content: README.md 1`] = `
 "# autocomplete.js-app
 
 _This project was generated with [create-instantsearch-app](https://github.com/algolia/create-instantsearch-app) by [Algolia](https://algolia.com)._
@@ -753,7 +1008,7 @@ yarn start
 Open http://localhost:3000 to see your app."
 `;
 
-exports[`Templates Autocomplete.js File content: index.html 1`] = `
+exports[`Templates Autocomplete.js 0 File content: index.html 1`] = `
 "<!DOCTYPE html>
 <html lang=\\"en\\">
 
@@ -802,7 +1057,7 @@ exports[`Templates Autocomplete.js File content: index.html 1`] = `
 </html>"
 `;
 
-exports[`Templates Autocomplete.js File content: manifest.webmanifest 1`] = `
+exports[`Templates Autocomplete.js 0 File content: manifest.webmanifest 1`] = `
 "{
   \\"short_name\\": \\"autocomplete.js-app\\",
   \\"name\\": \\"autocomplete.js-app Sample\\",
@@ -820,7 +1075,7 @@ exports[`Templates Autocomplete.js File content: manifest.webmanifest 1`] = `
 }"
 `;
 
-exports[`Templates Autocomplete.js File content: package.json 1`] = `
+exports[`Templates Autocomplete.js 0 File content: package.json 1`] = `
 "{
   \\"name\\": \\"autocomplete.js-app\\",
   \\"version\\": \\"1.0.0\\",
@@ -837,7 +1092,7 @@ exports[`Templates Autocomplete.js File content: package.json 1`] = `
 }"
 `;
 
-exports[`Templates Autocomplete.js File content: src/app.css 1`] = `
+exports[`Templates Autocomplete.js 0 File content: src/app.css 1`] = `
 ".header {
   align-items: center;
   background-image: linear-gradient(73deg, #3369e7, #1cc7d0);
@@ -925,7 +1180,7 @@ exports[`Templates Autocomplete.js File content: src/app.css 1`] = `
 }"
 `;
 
-exports[`Templates Autocomplete.js File content: src/app.js 1`] = `
+exports[`Templates Autocomplete.js 0 File content: src/app.js 1`] = `
 "import algoliasearch from 'algoliasearch';
 import autocomplete from 'autocomplete.js';
 
@@ -955,7 +1210,7 @@ autocomplete(
 });"
 `;
 
-exports[`Templates Autocomplete.js File content: src/index.css 1`] = `
+exports[`Templates Autocomplete.js 0 File content: src/index.css 1`] = `
 "body {
   background-color: #fcfcfd;
   color: #333;
@@ -965,7 +1220,7 @@ exports[`Templates Autocomplete.js File content: src/index.css 1`] = `
 }"
 `;
 
-exports[`Templates Autocomplete.js Folder structure: contains the right files 1`] = `
+exports[`Templates Autocomplete.js 0 Folder structure: contains the right files 1`] = `
 Array [
   ".editorconfig",
   ".eslintignore",
diff --git a/src/api/__tests__/__snapshots__/index.test.js.snap b/src/api/__tests__/__snapshots__/index.test.js.snap
index f45710d93..3b2ef7104 100644
--- a/src/api/__tests__/__snapshots__/index.test.js.snap
+++ b/src/api/__tests__/__snapshots__/index.test.js.snap
@@ -6,10 +6,10 @@ exports[`Options with invalid name throws 1`] = `
   - name can only contain URL-friendly characters"
 `;
 
-exports[`Options with unknown template throws 1`] = `"The template directory must contain a configuration file \`.template.js\` or must be one of those: Angular InstantSearch, Autocomplete.js, InstantSearch Android, InstantSearch iOS, InstantSearch.js, InstantSearch.js 2, InstantSearch.js widget, JavaScript Client, JavaScript Helper, JavaScript Helper 2, React InstantSearch, React InstantSearch Native, React InstantSearch widget, Vue InstantSearch, Vue InstantSearch 1, Vue InstantSearch 2"`;
+exports[`Options with unknown template throws 1`] = `"The template directory must contain a configuration file \`.template.js\` or must be one of those: Angular InstantSearch, Autocomplete, Autocomplete.js 0, InstantSearch Android, InstantSearch iOS, InstantSearch.js, InstantSearch.js 2, InstantSearch.js widget, JavaScript Client, JavaScript Helper, JavaScript Helper 2, React InstantSearch, React InstantSearch Native, React InstantSearch widget, Vue InstantSearch, Vue InstantSearch 1, Vue InstantSearch 2"`;
 
-exports[`Options with wrong template path throws 1`] = `"The template directory must contain a configuration file \`.template.js\` or must be one of those: Angular InstantSearch, Autocomplete.js, InstantSearch Android, InstantSearch iOS, InstantSearch.js, InstantSearch.js 2, InstantSearch.js widget, JavaScript Client, JavaScript Helper, JavaScript Helper 2, React InstantSearch, React InstantSearch Native, React InstantSearch widget, Vue InstantSearch, Vue InstantSearch 1, Vue InstantSearch 2"`;
+exports[`Options with wrong template path throws 1`] = `"The template directory must contain a configuration file \`.template.js\` or must be one of those: Angular InstantSearch, Autocomplete, Autocomplete.js 0, InstantSearch Android, InstantSearch iOS, InstantSearch.js, InstantSearch.js 2, InstantSearch.js widget, JavaScript Client, JavaScript Helper, JavaScript Helper 2, React InstantSearch, React InstantSearch Native, React InstantSearch widget, Vue InstantSearch, Vue InstantSearch 1, Vue InstantSearch 2"`;
 
 exports[`Options without path throws 1`] = `"The option \`path\` is required."`;
 
-exports[`Options without template throws 1`] = `"The template directory must contain a configuration file \`.template.js\` or must be one of those: Angular InstantSearch, Autocomplete.js, InstantSearch Android, InstantSearch iOS, InstantSearch.js, InstantSearch.js 2, InstantSearch.js widget, JavaScript Client, JavaScript Helper, JavaScript Helper 2, React InstantSearch, React InstantSearch Native, React InstantSearch widget, Vue InstantSearch, Vue InstantSearch 1, Vue InstantSearch 2"`;
+exports[`Options without template throws 1`] = `"The template directory must contain a configuration file \`.template.js\` or must be one of those: Angular InstantSearch, Autocomplete, Autocomplete.js 0, InstantSearch Android, InstantSearch iOS, InstantSearch.js, InstantSearch.js 2, InstantSearch.js widget, JavaScript Client, JavaScript Helper, JavaScript Helper 2, React InstantSearch, React InstantSearch Native, React InstantSearch widget, Vue InstantSearch, Vue InstantSearch 1, Vue InstantSearch 2"`;
diff --git a/src/templates/Autocomplete.js/.editorconfig b/src/templates/Autocomplete.js 0/.editorconfig
similarity index 100%
rename from src/templates/Autocomplete.js/.editorconfig
rename to src/templates/Autocomplete.js 0/.editorconfig
diff --git a/src/templates/Autocomplete.js/.eslintignore b/src/templates/Autocomplete.js 0/.eslintignore
similarity index 100%
rename from src/templates/Autocomplete.js/.eslintignore
rename to src/templates/Autocomplete.js 0/.eslintignore
diff --git a/src/templates/Autocomplete.js/.eslintrc.js b/src/templates/Autocomplete.js 0/.eslintrc.js
similarity index 100%
rename from src/templates/Autocomplete.js/.eslintrc.js
rename to src/templates/Autocomplete.js 0/.eslintrc.js
diff --git a/src/templates/Autocomplete.js/.gitignore.template b/src/templates/Autocomplete.js 0/.gitignore.template
similarity index 100%
rename from src/templates/Autocomplete.js/.gitignore.template
rename to src/templates/Autocomplete.js 0/.gitignore.template
diff --git a/src/templates/Autocomplete.js/.prettierrc b/src/templates/Autocomplete.js 0/.prettierrc
similarity index 100%
rename from src/templates/Autocomplete.js/.prettierrc
rename to src/templates/Autocomplete.js 0/.prettierrc
diff --git a/src/templates/Autocomplete.js/.template.js b/src/templates/Autocomplete.js 0/.template.js
similarity index 88%
rename from src/templates/Autocomplete.js/.template.js
rename to src/templates/Autocomplete.js 0/.template.js
index 807224b54..19be956c6 100644
--- a/src/templates/Autocomplete.js/.template.js
+++ b/src/templates/Autocomplete.js 0/.template.js	
@@ -3,7 +3,7 @@ const teardown = require('../../tasks/node/teardown');
 
 module.exports = {
   libraryName: 'autocomplete.js',
-  templateName: 'autocomplete.js',
+  templateName: 'autocomplete.js-0.x',
   appName: 'autocomplete.js-app',
   keywords: ['algolia', 'Autocomplete', 'autocomplete.js'],
   tasks: {
diff --git a/src/templates/Autocomplete.js/README.md b/src/templates/Autocomplete.js 0/README.md
similarity index 100%
rename from src/templates/Autocomplete.js/README.md
rename to src/templates/Autocomplete.js 0/README.md
diff --git a/src/templates/Autocomplete.js 0/favicon.png b/src/templates/Autocomplete.js 0/favicon.png
new file mode 100644
index 000000000..e67e0becc
Binary files /dev/null and b/src/templates/Autocomplete.js 0/favicon.png differ
diff --git a/src/templates/Autocomplete.js/index.html.hbs b/src/templates/Autocomplete.js 0/index.html.hbs
similarity index 100%
rename from src/templates/Autocomplete.js/index.html.hbs
rename to src/templates/Autocomplete.js 0/index.html.hbs
diff --git a/src/templates/Autocomplete.js/manifest.webmanifest b/src/templates/Autocomplete.js 0/manifest.webmanifest
similarity index 100%
rename from src/templates/Autocomplete.js/manifest.webmanifest
rename to src/templates/Autocomplete.js 0/manifest.webmanifest
diff --git a/src/templates/Autocomplete.js/package.json b/src/templates/Autocomplete.js 0/package.json
similarity index 100%
rename from src/templates/Autocomplete.js/package.json
rename to src/templates/Autocomplete.js 0/package.json
diff --git a/src/templates/Autocomplete.js/src/app.css b/src/templates/Autocomplete.js 0/src/app.css
similarity index 100%
rename from src/templates/Autocomplete.js/src/app.css
rename to src/templates/Autocomplete.js 0/src/app.css
diff --git a/src/templates/Autocomplete.js/src/app.js.hbs b/src/templates/Autocomplete.js 0/src/app.js.hbs
similarity index 100%
rename from src/templates/Autocomplete.js/src/app.js.hbs
rename to src/templates/Autocomplete.js 0/src/app.js.hbs
diff --git a/src/templates/Autocomplete.js/src/index.css b/src/templates/Autocomplete.js 0/src/index.css
similarity index 100%
rename from src/templates/Autocomplete.js/src/index.css
rename to src/templates/Autocomplete.js 0/src/index.css
diff --git a/src/templates/Autocomplete/.editorconfig b/src/templates/Autocomplete/.editorconfig
new file mode 100644
index 000000000..9d08a1a82
--- /dev/null
+++ b/src/templates/Autocomplete/.editorconfig
@@ -0,0 +1,9 @@
+root = true
+
+[*]
+charset = utf-8
+indent_style = space
+indent_size = 2
+end_of_line = lf
+insert_final_newline = true
+trim_trailing_whitespace = true
diff --git a/src/templates/Autocomplete/.eslintignore b/src/templates/Autocomplete/.eslintignore
new file mode 100644
index 000000000..9178ddcd8
--- /dev/null
+++ b/src/templates/Autocomplete/.eslintignore
@@ -0,0 +1,3 @@
+/node_modules
+/dist
+/.cache
diff --git a/src/templates/Autocomplete/.eslintrc.js b/src/templates/Autocomplete/.eslintrc.js
new file mode 100644
index 000000000..a429d51c2
--- /dev/null
+++ b/src/templates/Autocomplete/.eslintrc.js
@@ -0,0 +1,20 @@
+/* eslint-disable import/no-commonjs */
+
+module.exports = {
+  extends: ['algolia', 'algolia/react'],
+  settings: {
+    react: {
+      pragma: 'React',
+      version: 'preact',
+    },
+  },
+  rules: {
+    'jsdoc/check-tag-names': [
+      'error',
+      {
+        jsxTags: true,
+      },
+    ],
+    'react/jsx-filename-extension': 'off',
+  },
+};
diff --git a/src/templates/Autocomplete/.gitignore.template b/src/templates/Autocomplete/.gitignore.template
new file mode 100644
index 000000000..f0fb0457d
--- /dev/null
+++ b/src/templates/Autocomplete/.gitignore.template
@@ -0,0 +1,22 @@
+# See https://help.github.com/ignore-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+
+# testing
+/coverage
+
+# production
+/dist
+/.cache
+
+# misc
+.DS_Store
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
diff --git a/src/templates/Autocomplete/.prettierrc b/src/templates/Autocomplete/.prettierrc
new file mode 100644
index 000000000..833f03b62
--- /dev/null
+++ b/src/templates/Autocomplete/.prettierrc
@@ -0,0 +1,5 @@
+{
+  "singleQuote": true,
+  "proseWrap": "never",
+  "trailingComma": "es5"
+}
diff --git a/src/templates/Autocomplete/.template.js b/src/templates/Autocomplete/.template.js
new file mode 100644
index 000000000..749b874da
--- /dev/null
+++ b/src/templates/Autocomplete/.template.js
@@ -0,0 +1,14 @@
+const install = require('../../tasks/node/install');
+const teardown = require('../../tasks/node/teardown');
+
+module.exports = {
+  category: 'Web',
+  libraryName: '@algolia/autocomplete-js',
+  templateName: 'autocomplete',
+  appName: 'autocomplete-app',
+  keywords: ['algolia', 'autocomplete'],
+  tasks: {
+    install,
+    teardown,
+  },
+};
diff --git a/src/templates/Autocomplete/README.md b/src/templates/Autocomplete/README.md
new file mode 100644
index 000000000..f330c8c3e
--- /dev/null
+++ b/src/templates/Autocomplete/README.md
@@ -0,0 +1,21 @@
+# {{name}}
+
+_This project was generated with [create-instantsearch-app](https://github.com/algolia/create-instantsearch-app) by [Algolia](https://algolia.com)._
+
+## Get started
+
+To run this project locally, install the dependencies and run the local server:
+
+```sh
+npm install
+npm start
+```
+
+Alternatively, you may use [Yarn](https://http://yarnpkg.com/):
+
+```sh
+yarn
+yarn start
+```
+
+Open http://localhost:3000 to see your app.
diff --git a/src/templates/Autocomplete/app.js.hbs b/src/templates/Autocomplete/app.js.hbs
new file mode 100644
index 000000000..240bdfb8a
--- /dev/null
+++ b/src/templates/Autocomplete/app.js.hbs
@@ -0,0 +1,53 @@
+/** @jsx h */
+import { autocomplete, getAlgoliaResults } from '@algolia/autocomplete-js';
+import algoliasearch from 'algoliasearch';
+import { h } from 'preact';
+
+import '@algolia/autocomplete-theme-classic';
+
+const searchClient = algoliasearch('{{appId}}', '{{apiKey}}');
+
+autocomplete({
+  container: '#autocomplete',
+  placeholder: '{{placeholder}}',
+  debug: true,
+  getSources({ query }) {
+    return [
+      {
+        sourceId: 'items',
+        getItems() {
+          return getAlgoliaResults({
+            searchClient,
+            queries: [
+              {
+                indexName: '{{indexName}}',
+                query,
+              },
+            ],
+          });
+        },
+        templates: {
+          item({ item, components }) {
+            return (
+              <div className="aa-ItemWrapper">
+                <div className="aa-ItemContent">
+                  <div className="aa-ItemContentBody">
+                    <div className="aa-ItemContentTitle">
+                      <components.Highlight
+                        hit={item}
+                        attribute="{{attributesToDisplay.[0]}}"
+                      />
+                    </div>
+                  </div>
+                </div>
+              </div>
+            );
+          },
+          noResults() {
+            return 'No matching items.';
+          },
+        },
+      },
+    ];
+  },
+});
diff --git a/src/templates/Autocomplete/favicon.png b/src/templates/Autocomplete/favicon.png
new file mode 100644
index 000000000..084fdfdfc
Binary files /dev/null and b/src/templates/Autocomplete/favicon.png differ
diff --git a/src/templates/Autocomplete/index.html.hbs b/src/templates/Autocomplete/index.html.hbs
new file mode 100644
index 000000000..aa7de3b05
--- /dev/null
+++ b/src/templates/Autocomplete/index.html.hbs
@@ -0,0 +1,19 @@
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
+    <link rel="shortcut icon" href="favicon.png" type="image/x-icon" />
+    <link rel="stylesheet" href="style.css" />
+
+    <title>{{name}}</title>
+  </head>
+
+  <body>
+    <div class="container">
+      <div id="autocomplete"></div>
+    </div>
+
+    <script src="app.js"></script>
+  </body>
+</html>
diff --git a/src/templates/Autocomplete/manifest.webmanifest b/src/templates/Autocomplete/manifest.webmanifest
new file mode 100644
index 000000000..20ac76f5c
--- /dev/null
+++ b/src/templates/Autocomplete/manifest.webmanifest
@@ -0,0 +1,15 @@
+{
+  "short_name": "{{name}}",
+  "name": "{{name}} Sample",
+  "icons": [
+    {
+      "src": "favicon.png",
+      "sizes": "64x64 32x32 24x24 16x16",
+      "type": "image/x-icon"
+    }
+  ],
+  "start_url": "./index.html",
+  "display": "standalone",
+  "theme_color": "#000000",
+  "background_color": "#ffffff"
+}
diff --git a/src/templates/Autocomplete/package.json b/src/templates/Autocomplete/package.json
new file mode 100644
index 000000000..4fff04a5b
--- /dev/null
+++ b/src/templates/Autocomplete/package.json
@@ -0,0 +1,36 @@
+{
+  "name": "{{name}}",
+  "version": "1.0.0",
+  "private": true,
+  "scripts": {
+    "build": "parcel build index.html",
+    "start": "parcel index.html --port 3000",
+    "lint": "eslint ."
+  },
+  "dependencies": {
+    "@algolia/autocomplete-js": "{{libraryVersion}}",
+    "@algolia/autocomplete-theme-classic": "{{libraryVersion}}",
+    "algoliasearch": "4.10.5",
+    "preact": "10.5.14"
+  },
+  "devDependencies": {
+    "babel-eslint": "10.1.0",
+    "eslint": "7.32.0",
+    "eslint-config-algolia": "19.0.2",
+    "eslint-config-prettier": "8.3.0",
+    "eslint-plugin-eslint-comments": "3.2.0",
+    "eslint-plugin-import": "2.24.2",
+    "eslint-plugin-jsdoc": "36.1.0",
+    "eslint-plugin-jsx-a11y": "6.4.1",
+    "eslint-plugin-prettier": "4.0.0",
+    "eslint-plugin-react": "7.26.0",
+    "eslint-plugin-react-hooks": "4.2.0",
+    "parcel": "2.0.0-beta.2",
+    "prettier": "1.19.1"
+  },
+  "keywords": [
+    "algolia",
+    "autocomplete",
+    "javascript"
+  ]
+}
diff --git a/src/templates/Autocomplete/style.css b/src/templates/Autocomplete/style.css
new file mode 100644
index 000000000..a4d3906cf
--- /dev/null
+++ b/src/templates/Autocomplete/style.css
@@ -0,0 +1,20 @@
+* {
+  box-sizing: border-box;
+}
+
+body {
+  background-color: rgb(244, 244, 249);
+  color: rgb(65, 65, 65);
+  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
+    'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
+    sans-serif;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  padding: 1rem;
+}
+
+.container {
+  margin: 0 auto;
+  max-width: 640px;
+  width: 100%;
+}