* docs: use descriptive links instead of "click here"
Linking text such as "here" or "click here" is not accessible (and
doesn't look that great either). The best example of why it's better to
use link text that provides context is that some screen readers allow
navigation by links alone. If all links say "click here", then how does
the user know which one to go to?
I tried to make the minimal change necessary to make the link text
descriptive but had to reword a few sentences that didn't read well.
* Apply suggestions from code review
Co-authored-by: Lee Robinson <me@leerob.io>
Co-authored-by: JJ Kasper <jj@jjsweb.site>
Add `Open in StackBlitz` button to `examples/with-mobx-state-tree-typescript` now that it was fixed in #25589.
## Bug
- [ ] Related issues linked using `fixes #number`
- [ ] Integration tests added
## 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
- [x] Example(s) updated
- [ ] Telemetry added. In case of a feature if it's used or not.
## Documentation / Examples
- [x] Make sure the linting passes
Fixes one of the items that was mentioned in #25854.
It fixes the warning in `with-next-page-transitions` by moving the viewport tag to `_app.js` from `_document.js`
This PR adds a `Preview` section and a `Open in StackBlitz` button to various examples. I have tested all examples and omitted the ones that require third party API keys, or didn't work. Some examples don't work locally either.
Here's an example:
![image](https://user-images.githubusercontent.com/12571019/121027783-88971280-c7a7-11eb-851a-0ad30cf74b42.png)
## Bug
- [ ] Related issues linked using `fixes #number`
- [ ] Integration tests added
## 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
- [x] Examples updated
- [ ] Telemetry added. In case of a feature if it's used or not.
## Documentation / Examples
- [x] Make sure the linting passes
This updates the with-iron-session example with:
- updated way to mutate + fetch (re: https://github.com/vvo/next-iron-session/issues/329)
- updated readme to include TypeScript example link
Requirements:
- [x] Make sure the linting passes
Hey guys!
Some time ago I used the `with-grommet` example to start a project and I ran into some issues because of the styled-components version. I tried to use some new features and it didn't work as I expected, then I noticed the styled-component version was the `v4`. When I bumped the version it started to work. I am bumping all the styled-components versions on examples because some people may run into the same issue.
## Bug
- [ ] Related issues linked using `fixes #number`
- [ ] Integration tests added
## 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.
## Documentation / Examples
- [x] Make sure the linting passes
remove `alwaysStrict: true` rule from tsconfig.json in with-typescript example, because the rule is included in `strict: true` has been already written in tsconfig.json and other included rules such as `noImplicitAny: true` have not been written.
[tsconfig documentation link](https://www.typescriptlang.org/tsconfig#alwaysStrict)
## Documentation / Examples
- [x] Make sure the linting passes
- Fixed the missing prop `components` to `<MDXRemote/>`.
- Added a `defaultComponents` and `source` mdx to provide more clarity on the example.
## Documentation / Examples
- [x] Make sure the linting passes
## Changes
- Removes `mockServiceWorker.js` file and ignores it from Git. New versions of `msw` generate the worker script automatically at the location specified in `packageJson.msw.workerDirectory`. This keeps the worker script up-to-date with the currently installed version of `msw`.
- Updates `msw` package to the latest version for new features and stability improvements.
## Documentation / Examples
- [ ] Make sure the linting passes
## Bug
- [ ] Related issues linked using `fixes #number`
- [ ] Integration tests added
## 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.
## Documentation / Examples
- [ ] Make sure the linting passes
## Documentation / Examples
Kontent CMS went through the UI redesign - <http://new-ui.kontent.ai/>.
* I am updating the example screenshots.
* \+ one fix of the URL in README.
- example was submitted by me in #16034
- [x] Make sure the linting passes
This change fixes the issues with the PatternFly example showing how to
use PatternFly 4 in conjunction with Next.js:
1. next-transpile-modules has been updated to 7.2.0, which adds support
for Global CSS imports used by PatternFly 4. This eliminates the
custom Webpack modification that were necessary previously.
2. All dependencies have been updated to the latest version.
3. Documentation has been updated to include troubleshooting steps.
Addresses #20916
It's a change to the package.json file to update the supertokens-auth-react version. The changes in this version are:
- How supertokens session works in the context of an iframe
- Dependencies of supertokens-auth-react now use a `^`
--------
One more change is to do with how the redirection works in the demo app in case of session expiry or if a user clicks on signout.
## Changes
- Update dependencies
- Use new `useAnimations` hook
- Remove next-transpile-modules in favour of drei
- Refactor Components
- Remove dynamic import
- Enable webpack5 (by removing `next.config.js`)
- Removed missing key warning
## Bug
- [ ] Related issues linked using `fixes #number`
- [ ] Integration tests added
## 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.
## Documentation / Examples
- [x] Make sure the linting passes
This example currently fails to build with the error:
```
-> % yarn build
yarn run v1.22.10
$ next build
warn - React 17.0.1 or newer will be required to leverage all of the upcoming features in Next.js 11. Read more: https://nextjs.org/docs/messages/react-version
info - Using webpack 5. Reason: no next.config.js https://nextjs.org/docs/messages/webpack5
Failed to compile.
./components/alert.tsx:2:16
Type error: Could not find a declaration file for module 'classnames'. '/Users/mike/workspace/blog/node_modules/classnames/index.js' implicitly has an 'any' type.
Try `npm i --save-dev @types/classnames` if it exists or add a new declaration (.d.ts) file containing `declare module 'classnames';`
1 | import Container from './container'
> 2 | import cn from 'classnames'
| ^
3 | import { EXAMPLE_PATH } from '../lib/constants'
4 |
5 | type Props = {
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
```
As of [`v2.3.1`](https://github.com/JedWatson/classnames/blob/master/HISTORY.md#v230--2021-04-01), the `classnames` package started providing its own types, so the `@types/classnames` package [became a stub](https://unpkg.com/browse/@types/classnames@2.3.1/). We get the error because the `classnames` version is pinned to the old, type-less version, while `@types/classnames` picked up the new stubbed version.
Removing `@types/classnames` and updating `classnames` to the latest version fixes the build error.
## Documentation / Examples
- [x] Make sure the linting passes
## Bug
- [ ] Related issues linked using `fixes #number`
- [ ] Integration tests added
## 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.
## Documentation / Examples
- [ ] Make sure the linting passes
The [official Sentry Next.js SDK](https://docs.sentry.io/platforms/javascript/guides/nextjs/) is now the recommended choice to use with Next.js, instead of the previous workarounds. This PR updates the example, which now uses the SDK.
..to use new zustand/context module from zustand 3.5.0. Also fixed code for merging states on client-side navigation.
## Documentation / Examples
- [x] Make sure the linting passes
Unfortunately I couldn't push up changes for that branch as maintainers access was disabled.
Closes#18775
## Bug
- [ ] Related issues linked using `fixes #number`
- [ ] Integration tests added
## 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.
## Documentation / Examples
- [ ] Make sure the linting passes
This PR re-includes ESLint with some notable changes, namely a guided setup similar to how TypeScript is instantiated in a Next.js application.
To add ESLint to a project, developers will have to create an `.eslintrc` file in the root of their project or add an empty `eslintConfig` object to their `package.json` file.
```js
touch .eslintrc
```
Then running `next build` will show instructions to install the required packages needed:
<img width="862" alt="Screen Shot 2021-04-19 at 7 38 27 PM" src="https://user-images.githubusercontent.com/12476932/115316182-dfd51b00-a146-11eb-830c-90bad20ed151.png">
Once installed and `next build` is run again, `.eslintrc` will be automatically configured to include the default config:
```json
{
"extends": "next"
}
```
In addition to this change:
- The feature is now under the experimental flag and requires opt-in. After testing and feedback, it will be switched to the top-level namespace and turned on by default.
- A new ESLint shareable configuration package is included that can be extended in any application with `{ extends: 'next' }`
- This default config extends recommended rule sets from [`eslint-plugin-react`](https://www.npmjs.com/package/eslint-plugin-react), [`eslint-plugin-react-hooks`](https://www.npmjs.com/package/eslint-plugin-react-hooks), and [`eslint-plugin-next`](https://www.npmjs.com/package/@next/eslint-plugin-next)
- All rules in [`eslint-plugin-next`](https://www.npmjs.com/package/@next/eslint-plugin-next) have been modified to include actionable links that show more information to help resolve each issue
fixes#24401
Simply bumping `swr` to the latest version seems to fix the issue. 🥂
Couldn't find a consistent pattern across the examples, but most examples are flexible with swr version and use the semver caret.
Very standard use of the useSWR hook is there in the example with nothing obviously version specific.
Hi folks I know many people that use that example and it could be using the new version of React to be according with the NextJS v11
## Documentation / Examples
- [ ] Make sure the linting passes
- [ ] Make sure that the bumped up versions are okay
According to the official Next.js documentation on [Environmental Variables](https://nextjs.org/docs/basic-features/environment-variables):
> `process.env` is not a standard JavaScript object, so you’re not able to use object destructuring. Environment variables must be referenced as e.g. `process.env.NEXT_PUBLIC_PUBLISHABLE_KEY`, not `const { NEXT_PUBLIC_PUBLISHABLE_KEY } = process.env`.
<!--
Thanks for opening a PR! Your contribution is much appreciated.
In order to make sure your PR is handled as smoothly as possible we request that you follow the checklist sections below.
Choose the right checklist for the change that you're making:
-->
## Bug
- [ ] Related issues linked using `fixes #number`
- [ ] Integration tests added
## 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.
## Documentation / Examples
- [ ] Make sure the linting passes
- Update the Readme to use the latest Amplify CLI versions' prompts
- Update the example to use the [SSR features of AWS Amplify ](https://aws.amazon.com/blogs/mobile/ssr-support-for-aws-amplify-javascript-libraries/)
- Update to use Next version `10` instead of `9`
- Correctly use the types produced by the Amplify CLI in `API.ts`
- Add `amplify auth` and auth rules to the GraphQL model as suggested by the Amplify CLI.
## Bug
- [ ] Related issues linked using `fixes #number`
- [ ] Integration tests added
## 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.
## Documentation / Examples
- [x] Make sure the linting passes
The predev npm script assumes that vercel cli is installed. It's better for the example to run without it.
## Bug
- [ ] Related issues linked using `fixes #number`
- [ ] Integration tests added
## 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.
## Documentation / Examples
- [x] Make sure the linting passes
- Since SuperTokens is a self hosted solution, it can be added to 'Bring Your Own Database' as well (in https://nextjs.org/docs/authentication#supertokens)
- Improvements to code structure in the with-supertokens example
This PR adds an example for using Next.js with [Reflexjs](https://reflexjs.org).
Thank You
## Documentation / Examples
- [x] Make sure the linting passes
1. Logout is better called in a POST request (avoids caching in most situations + avoids weird CSRF "logout attacks", i.e. can't be logged out by clicking on an email link)
2. We should wait for logout to complete before mutating the user, otherwise some weird race conditions might prevent swr to catch the right logged out state
Remove clock and notes features to be consistent with `with-redux-toolkit` example, add unit test with Jest
## Bug
- [ ] Related issues linked using `fixes #number`
- [ ] Integration tests added
## 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.
## Documentation / Examples
- [x] Make sure the linting passes