After talking with markerikson, I've made some updates to the Redux examples:
- Updated the `with-redux` example to use the Redux Toolkit + TypeScript example
- Updated dependencies of `with-redux` to work with latest testing setup
- Removed `with-redux-toolkit` in favor of `with-redux`
- Removed `with-redux-toolkit-typescript` in favor of `with-redux`
- Removed `with-redux-code-splitting` in favor of `with-redux`
Updates the `with-google-tag-manager` to use Next.js' Script component with strategy set to `afterInteractive`
CC @janicklas-ralph
Closes: https://github.com/vercel/next.js/issues/26507
I imported a bunch of old markdown posts to the blog-starter example but some of the post metadata was not returned by the API in the example code.
For example, having `published: false` in post metadata was not returned in the item fields.
The problem was in check:
```
if (data[field]) {
items[field] = data[field]
}
```
This rejects all falsy values in addition to fields that are not set. Checking only for `undefined` should fix this issue.
I didn't find existing integration tests for the blog example nor an issue describing this problem.
## Bug
- [ ] Related issues linked using `fixes #number`
- [ ] Integration tests added
- [ ] Errors have helpful link attached, see `contributing.md`
Earlier it was:
```bash
npx create-next-app --example with-eslint with-eslint
# or
yarn create next-app --example with-eslint with-eslint
```
It was confusing for me,
as i couldn't identify which one is *example-name* and which one is *folder-name* (for *with-eslint*).
I checked other example folders and was able to digest the stuff.
But if a new programmer comes who is not familiar with next/npx,
this could have took some time to understand.
And Hence i modified the cmd it to the below, for better understanding:
```bash
npx create-next-app --example with-eslint with-eslint-app
# or
yarn create next-app --example with-eslint with-eslint-app
```
## Documentation / Examples
- [X] Make sure the linting passes
Example `with-typescript-graphql`has unmatched dependency tree in `react-test-renderer` lead to error in #28582, I changed version of `react-test-renderer` to `^17.0.1` and fix that issue.
Closes https://github.com/vercel/next.js/issues/28582
Updating @react-three/drei from 4.x to 7.x
I was having problems using this example and realized that it was caused by the "old" version of the lib.
Also updating @react-three/fiber and next to latest.
## Documentation / Examples
- [x] Make sure the linting passes
The with-stitches example is broken presumably due to changes in the Stitches API now that it's hit `1.0.0`. I've created an issue already: #28650
I've made three small changes:
- Replaced the createCss function in `stitcheds.config.js` with createStitches
- Replaced the getCssString function with getCssText in `stitches.config.js` and `pages/_documents.jsx`
- Bumped `@stitches/react` to `^1.0.0` 🎉
I've left the rest of the example code alone as I'm still exploring the library after seeing yesterdays release annoucement.
@peduarte Is there anything else that needs to updated?
The client now warns against missing `apiVersion` ([docs](https://www.sanity.io/docs/api-versioning)). This PR adds the config for using the latest API version. There shouldn't be breaking changes in this app.
## 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
* Update to use the latest MongoDB best practices.
* lint-fix
Co-authored-by: Lee Robinson <me@leerob.io>
Co-authored-by: jj@jjsweb.site <jj@jjsweb.site>
* Use recommended pattern in testing example
Since the official linter for testing library, `eslint-plugin-testing-library` recommends using `screen` to write queries, this MR updates the testing library example to follow the pattern recommended by the linter.
> DOM Testing Library (and other Testing Library frameworks built on top of it) exports a screen object which has every query (and a debug method). This works better with autocomplete and makes each test a little simpler to write and maintain.
> This rule aims to force writing tests using built-in queries directly from screen object rather than destructuring them from render result. Given the screen component does not expose utility methods such as rerender() or the container property, it is correct to use the render returned value in those scenarios.
See the `prefer-screen-queries` rules docs for more info: https://github.com/testing-library/eslint-plugin-testing-library/blob/main/docs/rules/prefer-screen-queries.md
* Update devDependencies
* Install and configure test linting
* Use recommended pattern in test
* Update test names for consistency
* Update docs
* Set jest environment in each file
* Use root true in `with-jest` eslint config
* Ensure nested .eslintrcs are not loaded for repo lint
Co-authored-by: jj@jjsweb.site <jj@jjsweb.site>
Just a small change to recently merged PR; for some reason `import couchbase from 'couchbase'` is not working correctly when I use create-next-app to bootstrap with the `with-couchbase` example, despite initially working within my local next.js directory. The wildcard import fixes that issue. Thanks!
## Documentation / Examples
- [x] Make sure the linting passes
## 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
- [x] Make sure the linting passes
This adds a simple `with-couchbase` example app complete with a check for successful connection (in `index.js`).
**Note:** To check the connection, this application runs a simple KV GET operation with a key that does not exist and expects a response of `document not found`. Any other response indicates a failure to connect.
Thank you!
* Add ci script to check examples
* Install moreutils for `sponge` command.
It's not very pretty, but I'm not sure how to replace sponge in a good way in the shell script
* Prettier names in the workflow
* Move "check-examples" into build_test_deploy workflow
* Start breaking the jq script into multiple lines
* Add checks for cleanups in vercel/next.js#27121
* Run the `check-examples.sh` script to cleanup all remaining examples.
* Add licences to all example/package.json that lack them
* Revert "Add licences to all example/package.json that lack them"
This reverts commit 5d4e25012f7334772b8ef5924bc355277e827cba.
* Update check-examples to remove `license` field from examples
* Remove `license` from all examples.
This was mentioned in vercel/next.js#27121 but it looks like it didn't end up being in the merge?
Co-authored-by: JJ Kasper <jj@jjsweb.site>
## Documentation / Examples
- [X] Make sure the linting passes
This adds an example using Jotai with Next.js. It uses the new hook `useHydrateAtoms` to hydrate atoms with values from the server.
* Only copy .gitignores to examples that are actual packages.
`custom-server` is just a `.md` redirecting users to the documentation.
* Add .gitignores to examples that lack them
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.
Update the `check-exampels.sh` script to also ensure all examples has `private: true` (763d9979f7)
Update exampels (1) that did not have `private: true` (bcdc4a3ae0)
This PR adds a with-cypress example to match the examples in upcoming docs.
## Documentation / Examples
- [ ] Make sure the linting passes
**Note:** This PR does not pass linting because ESLint needs to have the [eslint-plugin-cypress](https://github.com/cypress-io/eslint-plugin-cypress) installed globally to ignore the Cypress methods.
## Documentation / Examples
- [x] Make sure the linting passes
This PR updates our current with-jest example to match the examples in upcoming docs, add module alias configuration and be more consistent with Jest conventions.
## 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
- fix `with-fauna` example to populate client secret properly when auto-deploy on changes happens
- improve security by avoiding usage of the `FAUNA_ADMIN_KEY` in the application, now it's used in the setup script only
* Add joi and next-joi example
* Add more README information
* Update examples/with-joi/package.json
Co-authored-by: Lee Robinson <me@leerob.io>
* Update all dependencies to latest
Co-authored-by: Lee Robinson <me@leerob.io>
Based on https://github.com/vercel/next.js/pull/26708
- Renames FaunaDB -> Fauna
- Moves to Tailwind instead of bespoke styling
- Use SWR instead of hand-rolled fetch wrapper
- List/Create API for Guestbook
- Preps for setting correct environment variables from Vercel integration
`getAllPostsWithSlug` was missing an `await` on `fetchAPI`, resulting
in `data?.allPosts` always returning `undefined`. This meant SSG wasn't
aware of the paths it needed to generate.
I was trying to run the demo locally and found out that the create user function was missing, so I added it!
## Documentation / Examples
- [ ✔ ] Make sure the linting passes
`react-is` dependency was [dropped](8165cbe994) as part of `styled-components@v5`.
(I don't know which checkbox to check)
## 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
* add locale switcher to dynamic GSP page in i18n-routing example
* Apply suggestions from code review
Co-authored-by: JJ Kasper <jj@jjsweb.site>
* Add switcher to other pages as well
Co-authored-by: JJ Kasper <jj@jjsweb.site>
* Fixed typo and error when using Auth0 service;
`Allowed Web Origin` on Auth0 is now required to be set to `http://localhost:3000`
* lint-fix
Co-authored-by: JJ Kasper <jj@jjsweb.site>