Commit graph

49 commits

Author SHA1 Message Date
Oscar Busk
718003c8a7
Add incremental to template/tsconfig.json to avoid changes on first build (#30357)
I used `create-next-app` to create a new fancy Next 12 app, ran `yarn build` and got a git diff. The tsconfig.json had a `incremental` added by next. Just running build shouldn't need I have uncommitted changes.
2021-10-27 03:11:45 +00:00
Kristóf Poduszló
bc0b50d60d
feat: ignore incremental TS compilation build info (#30362) 2021-10-26 22:52:40 +02:00
C. Lewis
e2e747ef2d
fix(create-next-app): starter styling errors (#28096)
Fixes #27770.

Projects initialized with `create-next-app` should not only be totally functional in terms of styling, but ideally there would be as minimal CSS as possible to serve as a "jumping off point" for users (related: #24709, where I initially proposed this fix).

However, minor issues with the specific styling approaches in the template created by `create-next-app` break the page for small viewports. This is caused by an improper use of `display: flex` in conjunction with `min-height: 100vh` on the `.container` class, and I imagine it places a drag on the initial user experience due to the fact that every user who creates a project with `create-next-app` must *independently fix* this viewport sizing issue themselves.

For example, the top of the viewport on a small display (here, iPhone SE):

![image](https://user-images.githubusercontent.com/1657236/129430078-229d5fab-b719-458c-8a94-10fb8be3490d.png)

Notice the "Welcome to Next.js" message is missing: Its container is larger than the viewport, and is set to be a flex column with `justify-center`—so we are staring at the center of the container. To demonstrate better, here is the full page render for before and after this PR:

![image](https://user-images.githubusercontent.com/1657236/129430409-52134198-651a-4cf8-915d-68b699febd77.png)

This PR adjusts the styling to fix this issue, and also other styling issues on small screens, like grid width issues causing text to overflow (and the footer padding as seen above):

![image](https://user-images.githubusercontent.com/1657236/129430114-1dda7674-3b02-45d4-a4b3-37fc5053c6c4.png)

After these changes, and minor padding tweaks, this is the top of the viewport on an iPhone X (full render above):

![image](https://user-images.githubusercontent.com/1657236/129430224-1991c1a6-8c7e-4246-b4a5-44919fb850c6.png)

And on an iPhone SE:

![image](https://user-images.githubusercontent.com/1657236/129430259-4408c52f-6fc6-4f22-9cc6-bbdbbe8d7a1a.png)
2021-09-24 17:13:05 +00:00
Sam Royal
c4f9f1e1e0
Add line break to typescript template (#28760) 2021-09-06 13:37:40 +02:00
Burak
1b8bc249c7
Change create-next-app getting started text in TypeScript template (#28718)
## Bug

- [ ] Related issues linked using `fixes #number`
- [ ] Integration tests added
- [ ] Errors have helpful link attached, see `contributing.md`

## Feature

- [ ] Implements an existing feature request or RFC. Make sure the feature request has been accepted for implementation before opening a PR.
- [ ] Related issues linked using `fixes #number`
- [ ] Integration tests added
- [ ] Documentation added
- [ ] Telemetry added. In case of a feature if it's used or not.
- [ ] Errors have helpful link attached, see `contributing.md`

## Documentation / Examples

- [ ] Make sure the linting passes
2021-09-03 20:39:19 +00:00
Oscar Busk
25df53d19f
next-env.d.ts note in templates (#27983)
Hello! I was using `npx create-next-app --ts` to quickly bootstrap a basic next.js project with Typescript. It bothered me that I got git diff just from running `npm run build` inside the project, because the new notice in the `next-env.d.ts` file.

![image](https://user-images.githubusercontent.com/13413409/129115266-80e00bf3-78aa-40be-bd0f-a18aaa448a68.png)

So I went ahead and updated the `next-env.d.ts` file in [`packages/create-next-app/templates/typescript`](fb67ce9864/packages/create-next-app/templates/typescript/next-env.d.ts) to be exactly how the file looks after running once. (7417ecc09c)

Then I realized that I could probably do the same for all the `next-env.d.ts` that are spread out in the many examples, to make running those examples after cloning them feel a bit smoother. (fb67ce9864)

> However I skipped the [`with-typescript-graphql`](40f85f6d95/examples/with-typescript-graphql) example since that [`next-env.d.ts`](40f85f6d95/examples/with-typescript-graphql/next-env.d.ts (L4-L9)) actually has changes and I couldn't even run `yarn build` in that example, so I'm not sure what will happen with the `next-env.d.ts`. Someone who _gets_ that example will have to fix it I suppose.
2021-08-12 20:36:53 +00:00
stefanprobst
1969124d07
Add type annotation for NextConfig to CNA typescript template (#27872)
This adds a type annotation for the `NextConfig` type to `next.config.js` in the `create-next-app` typescript template.

## Bug

- [ ] Related issues linked using `fixes #number`
- [ ] Integration tests added
- [ ] Errors have helpful link attached, see `contributing.md`

## Feature

- [ ] Implements an existing feature request or RFC. Make sure the feature request has been accepted for implementation before opening a PR.
- [ ] Related issues linked using `fixes #number`
- [ ] Integration tests added
- [ ] Documentation added
- [ ] Telemetry added. In case of a feature if it's used or not.
- [ ] Errors have helpful link attached, see `contributing.md`

## Documentation / Examples

- [ ] Make sure the linting passes
2021-08-09 17:13:30 +00:00
Houssein Djirdeh
7a1c9eb17e
[ESLint] Introduce a new setup process when next lint is run for the first time (#26584)
This PR introduces an improved developer experience when `next lint` is run for the first time.

### Current behavior

`eslint-config-next` is a required package that must be installed before proceeding with `next lint` or `next build`:

![image](https://user-images.githubusercontent.com/12476932/123468791-43088100-d5c0-11eb-9ad0-5beb80b6c968.png)

Although this has helped many developers start using the new ESLint config, this has also resulted in a few issues:

- Users are required to install the full config (`eslint-config-next`) even if they do not use it or use the Next.js plugin directly (`eslint-plugin-next`).
  - #26348

- There's some confusion  on why `eslint-config-next` needs to be installed or how it should be used instead of `eslint-plugin-next`.
  - #26574
  - #26475
  - #26438

### New behavior

Instead of enforcing `eslint-config-next` as a required package, this PR prompts the user by asking what config they would like to start. This happens when `next lint` is run for the first time **and** if no ESLint configuration is detected in the application.

<img src="https://user-images.githubusercontent.com/12476932/124331177-e1668a80-db5c-11eb-8915-38d3dc20f5d4.gif" width="800" />

- The CLI will take care of installing `eslint` or `eslint-config-next` if either is not already installed
- Users now have the option to choose between a strict configuration (`next/core-web-vitals`) or just the base configuration (`next`)
- For users that decide to create their own ESLint configuration, or already have an existing one, **installing `eslint-config-next` will not be a requirement for `next lint` or `next build` to run**. A warning message will just show if the Next.js ESLint plugin is not detected in an ESLint config. 

  <img width="682" alt="Screen Shot 2021-06-25 at 3 02 12 PM" src="https://user-images.githubusercontent.com/12476932/123473329-6cc4a680-d5c6-11eb-9a57-d5c0b89a2732.png">

---

In addition, this PR also:

- Fixes #26348
- Updates documentation to make it more clear what approach to take for new and existing ESLint configurations
2021-08-04 21:53:15 +00:00
Noah Weingand
84b71c3a6a
change ts template readme api/index file extension from tsx to ts (#27485)
## Documentation / Examples

- [x] Make sure the linting passes

### Changes
* Corrected the file extension reference from .tsx to .ts for ```packages/create-next-app/templates/typescript/README-template.md```. 
This matches the actual file extension and avoids confusion for new users.
2021-07-25 18:56:35 +00:00
Yubin
736db42352
Add NextPage type to create-next-app typescript template (#27246)
## Documentation / Examples

- [x] Make sure the linting passes
2021-07-16 19:55:09 +00:00
Sachin Raja
ba88bfde3e
include image types in create-next-app next-env.d.ts (#26890)
Previous TypeScript template in `create-next-app` only had the following in `next-env.d.ts`
```ts
/// <reference types="next" />
/// <reference types="next/types/global" />
```

New `next-env.d.ts` has this:
```ts
/// <reference types="next" />
/// <reference types="next/types/global" />
/// <reference types="next/image-types/global" />
```

Next.js automatically adds the `image-types` reference, but it won't be included in the initial commit. 
## Documentation / Examples

- [x] Make sure the linting passes
2021-07-04 17:21:16 +00:00
Paco
d0f41f3b49
Update create-next-app template favicons (#26289) 2021-06-18 15:29:11 -05:00
Matt Gleich
7d02abc7ce
feat: have .tsx be in ts template for create-next-app (#25820)
Signed-off-by: Matthew Gleich <git@mattglei.ch>

Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>
Co-authored-by: Tim Neutkens <tim@timneutkens.nl>
2021-06-07 18:22:55 +02:00
Houssein Djirdeh
bbc28ccae0
next lint + ESLint in Create Next App (#25064)
Co-authored-by: Tim Neutkens <tim@timneutkens.nl>
Co-authored-by: Tim Neutkens <timneutkens@me.com>
2021-06-03 14:01:24 +02:00
Gerald Monaco
1ee97b3c5d
Enable Strict Mode in new create-next-app projects (#25696) 2021-06-02 12:08:54 +02:00
C. Lewis
9c77cda6c5
feat(create-next-app): add --ts, --typescript support (#24655)
Co-authored-by: Tim Neutkens <timneutkens@me.com>
2021-05-07 10:08:16 +02:00
Ahmed Essam
5e255b5fa2
Made template look correct in IE11 (#24245)
## Bug

Fixes #21324

## Documentation / Examples

- [X] Make sure the linting passes
2021-04-20 19:18:41 +00:00
Gary Meehan
c3d06a275f
Switch Create Next App default template to use next/image (#24076)
Follow PR to #23887 to add next/image.

Only other change was wrapping the image in a span to allow for the margin that was previously on the actual `<img>`

## Documentation / Examples

- [x] Make sure the linting passes
2021-04-15 12:50:39 +00:00
Gary Meehan
4f7f5f30de
Increase base Lighthouse score of default Create Next App template (#23887) 2021-04-12 11:16:53 +02:00
Lee Robinson
5a73859fe8
Update docs and Create Next App to use API Middlewares by default. (#21639) 2021-01-28 23:34:03 +00:00
Luc Leray
8eaabe2fb0
Fix deploy buttons URLs (#20834)
Fix all deploy button URLs in the Next.js repo to follow the following format:
```
https://vercel.com/new/git/external?repository-url=https://github.com/vercel/next.js/tree/canary/examples/<EXAMPLE_NAME>&project-name=<EXAMPLE_NAME>&repository-name=<EXAMPLE_NAME>
```

The detailed docs for the Deploy Button can be found here: https://vercel.com/docs/more/deploy-button.

Also updates legacy Vercel import flow URLs (starting with vercel.com/import or with vercel.com/new/project), to use the new vercel.com/new URLs.

---

For example, for the `hello-world` example:

The URL is https://vercel.com/new/git/external?repository-url=https://github.com/vercel/next.js/tree/canary/examples/hello-world&project-name=hello-world&repository-name=hello-world

And the deploy button looks like this:
[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/git/external?repository-url=https://github.com/vercel/next.js/tree/canary/examples/hello-world&project-name=hello-world&repository-name=hello-world)

---

For reference, I used the following regexes to search for the incorrect URLs

```
\(https://vercel.com/import/git\?s=https://github.com/vercel/next.js/tree/canary/examples/(.*)\)
\(https://vercel.com/import/git\?c=1&s=https://github.com/vercel/next.js/tree/canary/examples/([^&]*)(.*)\)
\(https://vercel.com/import/project\?template=https://github.com/vercel/next.js/tree/canary/examples/(.*)\)
https://vercel.com/import/git
https://vercel.com/import/select-scope
https://vercel.com/import
https://vercel.com/new/project
```
2021-01-07 01:40:29 +00:00
Erik August Johnson
76c0efb3dd
Update README-template.md for API endpoint info (#20024)
Adds brief summary in Getting Started to explain the `pages/api` functionality. The intention here is reduce confusion to new users of Next.js as to what `pages/api` is and how it works.
2020-12-14 09:22:55 +00:00
Sam Poder
c5b20d06fa
Remove Random Blank Line in create-next-app (#17328)
There was a blank line, this PR removes it :D
2020-09-24 08:57:48 +00:00
Tanmay Laud
f00ad581a1
Added .gitignore to examples that are deployed to vercel (#15127)
Co-authored-by: Joe Haddad <joe.haddad@zeit.co>
2020-07-16 10:52:23 -04:00
Mohamed SADAT
aacfa79ddf
feat(create-next-app): Use CSS and CSS modules in default application template (#13983)
Hello 👋

This PR is to replace styled-jsx by Global CSS and CSS modules in the default Next.js template according to the issue [#13965](https://github.com/vercel/next.js/issues/13965) opened by @Timer
2020-06-10 21:25:27 +00:00
Joe Haddad
4a12fb0a5f
Normalize example gitignores (#13768)
This removes a bunch of unnecessary `.gitignore`s and fixes some CMS examples that don't ignore `node_modules` etc.
2020-06-04 20:39:52 +00:00
Joe Haddad
b7e17e09e5
Update references to zeit/next.js (#13463) 2020-05-27 17:51:11 -04:00
Tim Neutkens
483bd3ddda
Rename ZEIT to Vercel (#12075)
* Find/replace

* Update more URLs

* More rename

* Fix remaining examples

* More updates

* Update create-next-app

* Update remaining text

* Update

Co-authored-by: Shu Uesugi <shu@chibicode.com>
2020-04-21 11:47:12 +02:00
JJ Kasper
28ca0a7086
Add API route to default CNA template (#11981) 2020-04-17 16:28:58 -05:00
Shu Uesugi
7b0802eb40
Use function for function components (#11695) 2020-04-06 10:44:40 +02:00
JJ Kasper
d8155b22ff
Add initial support for new env handling (#10525)
* Add initial support for new env config file

* Fix serverless processEnv call when no env is provided

* Add missing await for test method

* Update env config to .env.json and add dotenv loading

* ncc dotenv package

* Update type

* Update with new discussed behavior removing .env.json

* Update hot-reloader createEntrypoints

* Make sure .env is loaded before next.config.js

* Add tests for all separate .env files

* Remove comments

* Add override tests

* Add test for overriding env vars based on local environment

* Add support for .env.test

* Apply suggestions from code review

Co-Authored-By: Joe Haddad <joe.haddad@zeit.co>

* Use chalk for env loaded message

* Remove constant as it’s not needed

* Update test

* Update errsh, taskr, and CNA template ignores

* Make sure to only consider undefined missing

* Remove old .env ignore

* Update to not populate process.env with loaded env

* Add experimental flag and add loading of global env values

Co-authored-by: Tim Neutkens <timneutkens@me.com>
Co-authored-by: Joe Haddad <joe.haddad@zeit.co>
2020-03-26 13:32:41 +01:00
Tim Neutkens
69ba79346f
Update README-template.md 2020-03-05 17:35:41 +01:00
Shu Uesugi
c57cdbb31d
Rename zeit.co/new → zeit.co/import (#10674)
* Replace zeit.co/new → zeit.co/import

* Update deployment.md
2020-02-24 19:08:34 -05:00
Luis Alvarez D
88b1fe50c5
Remove react import in create-next-app template (#10564) 2020-02-18 09:51:11 +01:00
Shu Uesugi
9cfc09e3ab
Simplify create-next-app README (#10545)
* Rename to README-template.md

* Add yarn scripts

* Rewrite CNA README

* Forgot zeit link

* Simplify

* Update deploy doc

* Just link to the doc

* page is reloaded

* reload → update

* Deploy updates
2020-02-16 16:00:12 +01:00
Shu Uesugi
2ff0913864
Use filter for create-next-app template (#10496) 2020-02-11 12:33:27 -05:00
Luis Alvarez D
ea5c5164b2
Update utm links in create-next-app (#10442)
* Updated links

* Use default-example as the medium

* Apply suggestion

Co-authored-by: JJ Kasper <jj@jjsweb.site>
2020-02-06 17:03:51 -06:00
Luis Alvarez D
5a32c9cbbf
Update create app docs (#10382)
* Updated links

* Added utm

Co-authored-by: Joe Haddad <timer150@gmail.com>
2020-02-02 22:20:04 -05:00
Paco
81fd704681
Update the default template of create-next-app (#10327)
* Update the default template for create-next-app

* Fix link
2020-01-30 01:14:05 -05:00
Jerry Green
b66c34eac3 Fix js template to be TS compatible (#9941) 2020-01-04 12:41:35 +01:00
Joe Haddad
18a9c7e371
Improve linting rules to catch more errors (#9374)
* Update `packages/`

* Update examples

* Update tests

* Update bench

* Update top level files

* Fix build

* trigger
2019-11-10 19:24:53 -08:00
Ismael Martínez
7674bab7b1 Change /static directory in favor of /public directory for create-next-app (#8984) 2019-10-07 18:38:42 -04:00
Jigo Palillo
923547c056 Removes importance link attribute (#8951) 2019-10-03 15:05:07 -04:00
Joe Haddad
e8522f4032
Favicon should have low importance (#8878)
* Favicon should have low importance

* Update index.js
2019-09-27 11:05:31 -04:00
Joshua Byrd
9b3d9f4255 Make favicon work (#8776) 2019-09-18 11:15:21 -04:00
Joe Haddad
6444889c9b
Update Create Next App Template (#8648)
This updates the Create Next App template to remove the "Create Next App" card.

Instead, we now display cards to the docs, learn, and the examples.
2019-09-05 22:51:42 -04:00
Matthew Sweeney
6dbc64ff28 Update Link for create-next-app (#8423) 2019-08-19 13:02:58 +02:00
Lukáš Huvar
8dc5d22104 Remove next.config.js (#8139) 2019-07-27 19:46:40 +01:00
Joe Haddad
104d18c607
Rewrite Create Next App (#8030)
* Completely rewrite Create Next App

* Sort imports

* Show what package manager is being used

* Fix project name suggestion

* Update tests for new implementation

* Use normal prepublish command for on-install

* Upgrade Node version

* Switch to 8.16

* Disable v8 cache

* Swap out update check package and fix CLI boot
2019-07-19 15:55:30 -04:00