Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Confirm if user wants example when creating app #10543

Merged
merged 17 commits into from
Apr 7, 2020

Conversation

merelinguist
Copy link
Contributor

Currently, when a user runs create-next-app, it automatically generates a Next project from a blank template. This pull adds an extra question to the creation process, which confirms whether they want to use an example:

carbon

This was suggested by @leerob in #8090.

The first time I ran this I forgot about the examples flag and then had to re-run it because I wanted the styled-components example. I think it would help 😄

@ijjk
Copy link
Member

ijjk commented Feb 15, 2020

Stats from current PR

Default Server Mode
General
zeit/next.js canary merelinguist/next.js cli-create-from-example Change
buildDuration 11.7s 11.2s -479ms
nodeModulesSize 52.7 MB 52.7 MB
Client Bundles (main, webpack, commons)
zeit/next.js canary merelinguist/next.js cli-create-from-example Change
main-HASH.js gzip 5.13 kB 5.13 kB
webpack-HASH.js gzip 746 B 746 B
4952ddcd88e7..54d3.js gzip 4.68 kB 4.68 kB
commons.HASH.js gzip 4.06 kB 4.06 kB
de003c3a9d30..d239.js gzip 16.2 kB 16.2 kB
framework.HASH.js gzip 39.1 kB 39.1 kB
Overall change 70 kB 70 kB
Client Bundles (main, webpack, commons) Modern
zeit/next.js canary merelinguist/next.js cli-create-from-example Change
main-HASH.module.js gzip 4.13 kB 4.13 kB
webpack-HASH..dule.js gzip 746 B 746 B
4952ddcd88e7..dule.js gzip 5.56 kB 5.56 kB
de003c3a9d30..dule.js gzip 15.1 kB 15.1 kB
framework.HA..dule.js gzip 39.1 kB 39.1 kB
Overall change 64.6 kB 64.6 kB
Legacy Client Bundles (polyfills)
zeit/next.js canary merelinguist/next.js cli-create-from-example Change
polyfills-HASH.js gzip 4.76 kB 4.76 kB
Overall change 4.76 kB 4.76 kB
Client Pages
zeit/next.js canary merelinguist/next.js cli-create-from-example Change
_app.js gzip 1.15 kB 1.15 kB
_error.js gzip 4.07 kB 4.07 kB
hooks.js gzip 779 B 779 B
index.js gzip 222 B 222 B
link.js gzip 2.89 kB 2.89 kB
routerDirect.js gzip 283 B 283 B
withRouter.js gzip 282 B 282 B
Overall change 9.68 kB 9.68 kB
Client Pages Modern
zeit/next.js canary merelinguist/next.js cli-create-from-example Change
_app.module.js gzip 576 B 576 B
_error.module.js gzip 3.06 kB 3.06 kB
hooks.module.js gzip 371 B 371 B
index.module.js gzip 212 B 212 B
link.module.js gzip 2.46 kB 2.46 kB
routerDirect..dule.js gzip 273 B 273 B
withRouter.m..dule.js gzip 272 B 272 B
Overall change 7.22 kB 7.22 kB
Client Build Manifests
zeit/next.js canary merelinguist/next.js cli-create-from-example Change
_buildManifest.js gzip 61 B 61 B
_buildManife..dule.js gzip 61 B 61 B
Overall change 122 B 122 B
Rendered Page Sizes
zeit/next.js canary merelinguist/next.js cli-create-from-example Change
index.html gzip 1.03 kB 1.03 kB
link.html gzip 1.04 kB 1.04 kB
withRouter.html gzip 1.03 kB 1.03 kB
Overall change 3.11 kB 3.11 kB

Serverless Mode (Increase detected ⚠️)
General
zeit/next.js canary merelinguist/next.js cli-create-from-example Change
buildDuration 12.2s 13s ⚠️ +815ms
nodeModulesSize 52.7 MB 52.7 MB
Client Bundles (main, webpack, commons)
zeit/next.js canary merelinguist/next.js cli-create-from-example Change
main-HASH.js gzip 5.13 kB 5.13 kB
webpack-HASH.js gzip 746 B 746 B
4952ddcd88e7..54d3.js gzip 4.68 kB 4.68 kB
commons.HASH.js gzip 4.06 kB 4.06 kB
de003c3a9d30..d239.js gzip 16.2 kB 16.2 kB
framework.HASH.js gzip 39.1 kB 39.1 kB
Overall change 70 kB 70 kB
Client Bundles (main, webpack, commons) Modern
zeit/next.js canary merelinguist/next.js cli-create-from-example Change
main-HASH.module.js gzip 4.13 kB 4.13 kB
webpack-HASH..dule.js gzip 746 B 746 B
4952ddcd88e7..dule.js gzip 5.56 kB 5.56 kB
de003c3a9d30..dule.js gzip 15.1 kB 15.1 kB
framework.HA..dule.js gzip 39.1 kB 39.1 kB
Overall change 64.6 kB 64.6 kB
Legacy Client Bundles (polyfills)
zeit/next.js canary merelinguist/next.js cli-create-from-example Change
polyfills-HASH.js gzip 4.76 kB 4.76 kB
Overall change 4.76 kB 4.76 kB
Client Pages
zeit/next.js canary merelinguist/next.js cli-create-from-example Change
_app.js gzip 1.15 kB 1.15 kB
_error.js gzip 4.07 kB 4.07 kB
hooks.js gzip 779 B 779 B
index.js gzip 222 B 222 B
link.js gzip 2.89 kB 2.89 kB
routerDirect.js gzip 283 B 283 B
withRouter.js gzip 282 B 282 B
Overall change 9.68 kB 9.68 kB
Client Pages Modern
zeit/next.js canary merelinguist/next.js cli-create-from-example Change
_app.module.js gzip 576 B 576 B
_error.module.js gzip 3.06 kB 3.06 kB
hooks.module.js gzip 371 B 371 B
index.module.js gzip 212 B 212 B
link.module.js gzip 2.46 kB 2.46 kB
routerDirect..dule.js gzip 273 B 273 B
withRouter.m..dule.js gzip 272 B 272 B
Overall change 7.22 kB 7.22 kB
Client Build Manifests
zeit/next.js canary merelinguist/next.js cli-create-from-example Change
_buildManifest.js gzip 61 B 61 B
_buildManife..dule.js gzip 61 B 61 B
Overall change 122 B 122 B
Serverless bundles Overall increase ⚠️
zeit/next.js canary merelinguist/next.js cli-create-from-example Change
_error.js gzip 290 kB 290 kB -269 B
404.html gzip 1.44 kB 1.44 kB
hooks.html gzip 1.08 kB 1.08 kB
index.js gzip 289 kB 289 kB -58 B
link.js gzip 319 kB 319 kB -229 B
routerDirect.js gzip 316 kB 316 kB ⚠️ +386 B
withRouter.js gzip 315 kB 316 kB ⚠️ +859 B
Overall change 1.53 MB 1.53 MB ⚠️ +689 B

Commit: 8f192de

Copy link
Member

@lfades lfades left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Some things I don't like about this change:

  • Even though this may be helpful, it introduces a new question, meaning more time required to start the app
  • We have over 200 examples, and every example includes a download link with create-next-app, afaik when we add a reference to create-next-app it either already includes the name of the example or it doesn't because we want the user to download the default example (and that example is a good introduction to Next.js).

Alternative: Ask for the name of the example if the user wants an example, but doesn't know which one, e.g: yarn next-app --example

@merelinguist
Copy link
Contributor Author

Screenshot 2020-02-17 at 20 15 03

@lfades Just FYI this is what the Gatsby CLI does, but I 100% see where you’re coming from as far as simplicity/speed goes :). I’ve amended as instructed, let me know what you think.

@ijjk
Copy link
Member

ijjk commented Feb 17, 2020

Stats from current PR

Default Server Mode
General
zeit/next.js canary merelinguist/next.js cli-create-from-example Change
buildDuration 12s 12.1s ⚠️ +145ms
nodeModulesSize 52.7 MB 52.7 MB
Client Bundles (main, webpack, commons)
zeit/next.js canary merelinguist/next.js cli-create-from-example Change
main-HASH.js gzip 5.14 kB 5.14 kB
webpack-HASH.js gzip 746 B 746 B
4952ddcd88e7..54d3.js gzip 4.68 kB 4.68 kB
commons.HASH.js gzip 4.06 kB 4.06 kB
de003c3a9d30..4e43.js gzip 16.2 kB 16.2 kB
framework.HASH.js gzip 39.1 kB 39.1 kB
Overall change 70 kB 70 kB
Client Bundles (main, webpack, commons) Modern
zeit/next.js canary merelinguist/next.js cli-create-from-example Change
main-HASH.module.js gzip 4.14 kB 4.14 kB
webpack-HASH..dule.js gzip 746 B 746 B
4952ddcd88e7..dule.js gzip 5.56 kB 5.56 kB
de003c3a9d30..dule.js gzip 15.1 kB 15.1 kB
framework.HA..dule.js gzip 39.1 kB 39.1 kB
Overall change 64.7 kB 64.7 kB
Legacy Client Bundles (polyfills)
zeit/next.js canary merelinguist/next.js cli-create-from-example Change
polyfills-HASH.js gzip 4.76 kB 4.76 kB
Overall change 4.76 kB 4.76 kB
Client Pages
zeit/next.js canary merelinguist/next.js cli-create-from-example Change
_app.js gzip 1.15 kB 1.15 kB
_error.js gzip 4.07 kB 4.07 kB
hooks.js gzip 779 B 779 B
index.js gzip 222 B 222 B
link.js gzip 2.89 kB 2.89 kB
routerDirect.js gzip 283 B 283 B
withRouter.js gzip 282 B 282 B
Overall change 9.68 kB 9.68 kB
Client Pages Modern
zeit/next.js canary merelinguist/next.js cli-create-from-example Change
_app.module.js gzip 576 B 576 B
_error.module.js gzip 3.06 kB 3.06 kB
hooks.module.js gzip 371 B 371 B
index.module.js gzip 212 B 212 B
link.module.js gzip 2.46 kB 2.46 kB
routerDirect..dule.js gzip 273 B 273 B
withRouter.m..dule.js gzip 272 B 272 B
Overall change 7.22 kB 7.22 kB
Client Build Manifests
zeit/next.js canary merelinguist/next.js cli-create-from-example Change
_buildManifest.js gzip 61 B 61 B
_buildManife..dule.js gzip 61 B 61 B
Overall change 122 B 122 B
Rendered Page Sizes
zeit/next.js canary merelinguist/next.js cli-create-from-example Change
index.html gzip 1.03 kB 1.03 kB
link.html gzip 1.04 kB 1.04 kB
withRouter.html gzip 1.03 kB 1.03 kB
Overall change 3.11 kB 3.11 kB

Serverless Mode (Decrease detected ✓)
General
zeit/next.js canary merelinguist/next.js cli-create-from-example Change
buildDuration 13.3s 13.2s -36ms
nodeModulesSize 52.7 MB 52.7 MB
Client Bundles (main, webpack, commons)
zeit/next.js canary merelinguist/next.js cli-create-from-example Change
main-HASH.js gzip 5.14 kB 5.14 kB
webpack-HASH.js gzip 746 B 746 B
4952ddcd88e7..54d3.js gzip 4.68 kB 4.68 kB
commons.HASH.js gzip 4.06 kB 4.06 kB
de003c3a9d30..4e43.js gzip 16.2 kB 16.2 kB
framework.HASH.js gzip 39.1 kB 39.1 kB
Overall change 70 kB 70 kB
Client Bundles (main, webpack, commons) Modern
zeit/next.js canary merelinguist/next.js cli-create-from-example Change
main-HASH.module.js gzip 4.14 kB 4.14 kB
webpack-HASH..dule.js gzip 746 B 746 B
4952ddcd88e7..dule.js gzip 5.56 kB 5.56 kB
de003c3a9d30..dule.js gzip 15.1 kB 15.1 kB
framework.HA..dule.js gzip 39.1 kB 39.1 kB
Overall change 64.7 kB 64.7 kB
Legacy Client Bundles (polyfills)
zeit/next.js canary merelinguist/next.js cli-create-from-example Change
polyfills-HASH.js gzip 4.76 kB 4.76 kB
Overall change 4.76 kB 4.76 kB
Client Pages
zeit/next.js canary merelinguist/next.js cli-create-from-example Change
_app.js gzip 1.15 kB 1.15 kB
_error.js gzip 4.07 kB 4.07 kB
hooks.js gzip 779 B 779 B
index.js gzip 222 B 222 B
link.js gzip 2.89 kB 2.89 kB
routerDirect.js gzip 283 B 283 B
withRouter.js gzip 282 B 282 B
Overall change 9.68 kB 9.68 kB
Client Pages Modern
zeit/next.js canary merelinguist/next.js cli-create-from-example Change
_app.module.js gzip 576 B 576 B
_error.module.js gzip 3.06 kB 3.06 kB
hooks.module.js gzip 371 B 371 B
index.module.js gzip 212 B 212 B
link.module.js gzip 2.46 kB 2.46 kB
routerDirect..dule.js gzip 273 B 273 B
withRouter.m..dule.js gzip 272 B 272 B
Overall change 7.22 kB 7.22 kB
Client Build Manifests
zeit/next.js canary merelinguist/next.js cli-create-from-example Change
_buildManifest.js gzip 61 B 61 B
_buildManife..dule.js gzip 61 B 61 B
Overall change 122 B 122 B
Serverless bundles Overall decrease ✓
zeit/next.js canary merelinguist/next.js cli-create-from-example Change
_error.js gzip 289 kB 290 kB ⚠️ +593 B
404.html gzip 1.45 kB 1.45 kB
hooks.html gzip 1.08 kB 1.08 kB
index.js gzip 289 kB 289 kB -187 B
link.js gzip 319 kB 319 kB -638 B
routerDirect.js gzip 316 kB 315 kB -1.05 kB
withRouter.js gzip 317 kB 316 kB -393 B
Overall change 1.53 MB 1.53 MB -1.67 kB

Commit: 5952dfa

@lfades lfades self-requested a review February 17, 2020 21:51
@ijjk
Copy link
Member

ijjk commented Feb 18, 2020

Stats from current PR

Default Server Mode
General
zeit/next.js canary merelinguist/next.js cli-create-from-example Change
buildDuration 9.8s 10.3s ⚠️ +439ms
nodeModulesSize 53.8 MB 53.8 MB
Client Bundles (main, webpack, commons)
zeit/next.js canary merelinguist/next.js cli-create-from-example Change
main-HASH.js gzip 5.05 kB 5.05 kB
webpack-HASH.js gzip 746 B 746 B
de003c3a9d30..abdd.js gzip 12.2 kB 12.2 kB
framework.HASH.js gzip 39.1 kB 39.1 kB
Overall change 57.2 kB 57.2 kB
Client Bundles (main, webpack, commons) Modern
zeit/next.js canary merelinguist/next.js cli-create-from-example Change
main-HASH.module.js gzip 4.13 kB 4.13 kB
webpack-HASH..dule.js gzip 746 B 746 B
de003c3a9d30..dule.js gzip 9.2 kB 9.2 kB
framework.HA..dule.js gzip 39.1 kB 39.1 kB
Overall change 53.2 kB 53.2 kB
Legacy Client Bundles (polyfills)
zeit/next.js canary merelinguist/next.js cli-create-from-example Change
polyfills-HASH.js gzip 20.3 kB 20.3 kB
Overall change 20.3 kB 20.3 kB
Client Pages
zeit/next.js canary merelinguist/next.js cli-create-from-example Change
_app.js gzip 1.06 kB 1.06 kB
_error.js gzip 2.98 kB 2.98 kB
hooks.js gzip 664 B 664 B
index.js gzip 222 B 222 B
link.js gzip 1.89 kB 1.89 kB
routerDirect.js gzip 279 B 279 B
withRouter.js gzip 278 B 278 B
Overall change 7.37 kB 7.37 kB
Client Pages Modern
zeit/next.js canary merelinguist/next.js cli-create-from-example Change
_app.module.js gzip 577 B 577 B
_error.module.js gzip 2.08 kB 2.08 kB
hooks.module.js gzip 370 B 370 B
index.module.js gzip 212 B 212 B
link.module.js gzip 1.47 kB 1.47 kB
routerDirect..dule.js gzip 271 B 271 B
withRouter.m..dule.js gzip 270 B 270 B
Overall change 5.25 kB 5.25 kB
Client Build Manifests
zeit/next.js canary merelinguist/next.js cli-create-from-example Change
_buildManifest.js gzip 61 B 61 B
_buildManife..dule.js gzip 61 B 61 B
Overall change 122 B 122 B
Rendered Page Sizes
zeit/next.js canary merelinguist/next.js cli-create-from-example Change
index.html gzip 926 B 926 B
link.html gzip 933 B 933 B
withRouter.html gzip 922 B 922 B
Overall change 2.78 kB 2.78 kB

Serverless Mode (Decrease detected ✓)
General
zeit/next.js canary merelinguist/next.js cli-create-from-example Change
buildDuration 10.8s 10.5s -266ms
nodeModulesSize 53.8 MB 53.8 MB
Client Bundles (main, webpack, commons)
zeit/next.js canary merelinguist/next.js cli-create-from-example Change
main-HASH.js gzip 5.05 kB 5.05 kB
webpack-HASH.js gzip 746 B 746 B
de003c3a9d30..abdd.js gzip 12.2 kB 12.2 kB
framework.HASH.js gzip 39.1 kB 39.1 kB
Overall change 57.2 kB 57.2 kB
Client Bundles (main, webpack, commons) Modern
zeit/next.js canary merelinguist/next.js cli-create-from-example Change
main-HASH.module.js gzip 4.13 kB 4.13 kB
webpack-HASH..dule.js gzip 746 B 746 B
de003c3a9d30..dule.js gzip 9.2 kB 9.2 kB
framework.HA..dule.js gzip 39.1 kB 39.1 kB
Overall change 53.2 kB 53.2 kB
Legacy Client Bundles (polyfills)
zeit/next.js canary merelinguist/next.js cli-create-from-example Change
polyfills-HASH.js gzip 20.3 kB 20.3 kB
Overall change 20.3 kB 20.3 kB
Client Pages
zeit/next.js canary merelinguist/next.js cli-create-from-example Change
_app.js gzip 1.06 kB 1.06 kB
_error.js gzip 2.98 kB 2.98 kB
hooks.js gzip 664 B 664 B
index.js gzip 222 B 222 B
link.js gzip 1.89 kB 1.89 kB
routerDirect.js gzip 279 B 279 B
withRouter.js gzip 278 B 278 B
Overall change 7.37 kB 7.37 kB
Client Pages Modern
zeit/next.js canary merelinguist/next.js cli-create-from-example Change
_app.module.js gzip 577 B 577 B
_error.module.js gzip 2.08 kB 2.08 kB
hooks.module.js gzip 370 B 370 B
index.module.js gzip 212 B 212 B
link.module.js gzip 1.47 kB 1.47 kB
routerDirect..dule.js gzip 271 B 271 B
withRouter.m..dule.js gzip 270 B 270 B
Overall change 5.25 kB 5.25 kB
Client Build Manifests
zeit/next.js canary merelinguist/next.js cli-create-from-example Change
_buildManifest.js gzip 61 B 61 B
_buildManife..dule.js gzip 61 B 61 B
Overall change 122 B 122 B
Serverless bundles Overall decrease ✓
zeit/next.js canary merelinguist/next.js cli-create-from-example Change
_error.js gzip 289 kB 289 kB -251 B
404.html gzip 1.33 kB 1.33 kB
hooks.html gzip 965 B 965 B
index.js gzip 289 kB 290 kB ⚠️ +248 B
link.js gzip 299 kB 297 kB -1.37 kB
routerDirect.js gzip 297 kB 296 kB -597 B
withRouter.js gzip 296 kB 296 kB ⚠️ +310 B
Overall change 1.47 MB 1.47 MB -1.66 kB

Commit: 83d19e9

Copy link
Member

@lfades lfades left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM, I've updated the PR so I'll wait for the review of someone else from the team

@timneutkens
Copy link
Member

timneutkens commented Mar 26, 2020

If it's asked under create-next-app --example it's unlikely anyone will use it as it's not easy to know it exists. I'm not opposed to asking it as part of the normal flow, but it should have an option to not do so.

@lfades
Copy link
Member

lfades commented Mar 26, 2020

@timneutkens "I'm not opposed to asking it as part of the normal flow": Should we keep it as an additional step as introduced initially in this PR?

@timneutkens
Copy link
Member

timneutkens commented Mar 27, 2020

@timneutkens "I'm not opposed to asking it as part of the normal flow": Should we keep it as an additional step as introduced initially in this PR?

Yeah there's basically 2 options:

  • Add it as part of the default flow unless --example <something> is provided explicitly
  • Don't add this feature

Hiding it under --example will cause it to not be used by users, so then it's not worth the additional install weight

@lfades
Copy link
Member

lfades commented Mar 28, 2020

@timneutkens I've updated the PR to ask for a template, it can be the default starter app or an example.

@timneutkens
Copy link
Member

@lfades could you add a gif/video of what it will look like

@merelinguist
Copy link
Contributor Author

@timneutkens
Copy link
Member

Nice! Looks great!

@lfades
Copy link
Member

lfades commented Mar 30, 2020

Did some UX changes, the PR is now ready for merge

@Timer Timer added this to the 9.3.5 milestone Apr 7, 2020
@Timer Timer merged commit bc7d183 into vercel:canary Apr 7, 2020
@vercel vercel locked as resolved and limited conversation to collaborators Jan 31, 2022
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

5 participants