Confirm if user wants example when creating app

packages/create-next-app/helpers/examples.ts

@@ -69,3 +69,10 @@ export function downloadAndExtractExample(
     tar.extract({ cwd: root, strip: 3 }, [`next.js-canary/examples/${name}`])
   )
 }
+
+export async function listExamples(): Promise<any> {
+  const res = await got(
+    'https://api.github.com/repositories/70107786/contents/examples'
+  ).catch(e => e)
+  return JSON.parse(res.body)
+}

packages/create-next-app/index.ts

@@ -9,6 +9,7 @@ import { createApp } from './create-app'
 import { validateNpmName } from './helpers/validate-pkg'
 import packageJson from './package.json'
 import { shouldUseYarn } from './helpers/should-use-yarn'
+import { listExamples } from './helpers/examples'
 
 let projectPath: string = ''
 
@@ -21,7 +22,7 @@ const program = new Commander.Command(packageJson.name)
   })
   .option('--use-npm')
   .option(
-    '-e, --example <name>|<github-url>',
+    '-e, --example [name]|[github-url]',
     `
 
   An example to bootstrap the app with. You can use an example name
@@ -98,6 +99,51 @@ async function run() {
     process.exit(1)
   }
 
+  // --example flag included, but no example path provided, i.e.:
+  // $ create-next-app --example
+  if (program.example && typeof program.example !== 'string') {
+    const wantsRes = await prompts({
+      type: 'confirm',
+      name: 'wantsExample',
+      message:
+        'You forgot to select an example, would you like to pick one now?',
+      initial: false,
+    })
+
+    if (wantsRes.wantsExample) {
+      const examplesJSON = await listExamples()
+      const choices = examplesJSON.map((example: any) => ({
+        title: example.name,
+        value: example.name,
+      }))
+      // The search function built into `prompts` isn’t very helpful:
+      // someone searching for `styled-components` would get no results since
+      // the example is called `with-styled-components`, and `prompts` searches
+      // the beginnings of titles.
+      const nameRes = await prompts({
+        type: 'autocomplete',
+        name: 'exampleName',
+        message: 'Pick an example',
+        choices,
+        suggest: (input: any, choices: any) =>
+          choices.filter((choice: any) => choice.title.includes(input)),
+      })
+
+      if (!nameRes.exampleName) {
+        console.error(
+          'Could not locate an example with that name. Creating project from blank starter instead.'
+        )
+      }
+
+      program.example = nameRes.exampleName
+
+      // If the user says 'no' to choosing from examples, they are warned that the default
+      // template is being used.
+    } else {
+      console.warn(chalk.yellow('Creating project from blank starter instead.'))
+    }
+  }
+
   await createApp({
     appPath: resolvedProjectPath,
     useNpm: !!program.useNpm,

test/integration/create-next-app/index.test.js

@@ -150,4 +150,32 @@ describe('create next app', () => {
       fs.existsSync(path.join(cwd, projectName, '.gitignore'))
     ).toBeTruthy()
   })
+
+  it('Should ask for an example', async () => {
+    const question = async (...args) => {
+      return new Promise((resolve, reject) => {
+        const res = run(...args)
+
+        let timeout = setTimeout(() => {
+          if (!res.killed) {
+            res.kill()
+            reject(new Error('Missing request to select example name'))
+          }
+        }, 2000)
+
+        res.stdout.on('data', data => {
+          const stdout = data.toString()
+          if (stdout.includes('y/N')) {
+            res.kill()
+            clearTimeout(timeout)
+            resolve(stdout)
+          }
+        })
+      })
+    }
+
+    expect(await question('no-example', '--example')).toMatch(
+      /You forgot to select an example, would you like to pick one now/
+    )
+  })
 })