docs: fix typos

docs/going-to-production.md

@@ -71,8 +71,8 @@ export async function getServerSideProps({ req, res }) {
 
 By default, `Cache-Control` headers will be set differently depending on how your page fetches data.
 
-- If the page uses `getServerSideProps` or `getInitialProps`, it will use the default `Cache-Control` header set by `next start` in order to prevent accidental caching of responses that cannot be cached. If you want a different cache behavior while using `getServerSideProps`, use `res.setHeader('Cache-Control', 'value_you_prefer')` inside of the function as shown above.
-- If the page is using `getStaticProps`, it will have a `Cache-Control` header of `s-maxage=REVALIDATE_SECONDS, stale-while-revalidate`, or if `revalidate` is _not_ used , `s-maxage=31536000, stale-while-revalidate` to cache for the maximum age possible.
+- If the page uses `getServerSideProps` or `getInitialProps`, it will use the default `Cache-Control` header set by the `next start` in order to prevent accidental caching of responses that cannot be cached. If you want a different cache behavior while using `getServerSideProps`, use `res.setHeader('Cache-Control', 'value_you_prefer')` inside of the function as shown above.
+- If the page is using `getStaticProps`, it will have a `Cache-Control` header of `s-maxage=REVALIDATE_SECONDS, stale-while-revalidate`, or if `revalidate` is _not_ used, `s-maxage=31536000, stale-while-revalidate` to the cache for the maximum age possible.
 
 > **Note:** Your deployment provider must support caching for dynamic responses. If you are self-hosting, you will need to add this logic yourself using a key/value store like Redis. If you are using Vercel, [Edge Caching works without configuration](https://vercel.com/docs/edge-network/caching?utm_source=next-site&utm_medium=docs&utm_campaign=next-website).
 
@@ -90,10 +90,10 @@ To reduce the amount of JavaScript sent to the browser, you can use the followin
 - [Import Cost](https://marketplace.visualstudio.com/items?itemName=wix.vscode-import-cost) – Display the size of the imported package inside VSCode.
 - [Package Phobia](https://packagephobia.com/) – Find the cost of adding a new dev dependency to your project.
 - [Bundle Phobia](https://bundlephobia.com/) - Analyze how much a dependency can increase bundle sizes.
-- [Webpack Bundle Analyzer](https://github.com/vercel/next.js/tree/canary/packages/next-bundle-analyzer) – Visualize size of webpack output files with an interactive, zoomable treemap.
+- [Webpack Bundle Analyzer](https://github.com/vercel/next.js/tree/canary/packages/next-bundle-analyzer) – Visualize the size of webpack output files with an interactive, zoomable treemap.
 - [bundlejs](https://bundlejs.com/) - An online tool to quickly bundle & minify your projects, while viewing the compressed gzip/brotli bundle size, all running locally on your browser.
 
-Each file inside your `pages/` directory will automatically be code split into its own JavaScript bundle during `next build`. You can also use [Dynamic Imports](/docs/advanced-features/dynamic-import.md) to lazy-load components and libraries. For example, you might want to defer loading your modal code until a user clicks the open button.
+Each file inside your `pages/` directory will automatically be code split into its own JavaScript bundle during the `next build`. You can also use [Dynamic Imports](/docs/advanced-features/dynamic-import.md) to lazy-load components and libraries. For example, you might want to defer loading your modal code until a user clicks the open button.
 
 ## Logging
 
@@ -128,7 +128,7 @@ You can also log and track exceptions with a tool like Sentry. [This example](ht
 
 To improve loading performance, you first need to determine what to measure and how to measure it. [Core Web Vitals](https://vercel.com/blog/core-web-vitals?utm_source=next-site&utm_medium=docs&utm_campaign=next-website) is a good industry standard that is measured using your own web browser. If you are not familiar with the metrics of Core Web Vitals, review this [blog post](https://vercel.com/blog/core-web-vitals?utm_source=next-site&utm_medium=docs&utm_campaign=next-website) and determine which specific metric/s will be your drivers for loading performance. Ideally, you would want to measure the loading performance in the following environments:
 
-- In the lab, using your own computer or a simulator.
+- In the lab, use your own computer or a simulator.
 - In the field, using real-world data from actual visitors.
 - Local, using a test that runs on your device.
 - Remote, using a test that runs in the cloud.
@@ -142,7 +142,7 @@ Once you are able to measure the loading performance, use the following strategi
   - Setting up your Code Editor to view import costs and sizes
   - Finding alternative smaller packages
   - Dynamically loading components and dependencies
-  - For more in depth information, review this [guide](https://papyrus.dev/@PapyrusBlog/how-we-reduced-next.js-page-size-by-3.5x-and-achieved-a-98-lighthouse-score) and this [performance checklist](https://dev.to/endymion1818/nextjs-performance-checklist-5gjb).
+  - For more in-depth information, review this [guide](https://papyrus.dev/@PapyrusBlog/how-we-reduced-next.js-page-size-by-3.5x-and-achieved-a-98-lighthouse-score) and this [performance checklist](https://dev.to/endymion1818/nextjs-performance-checklist-5gjb).
 
 ## Related
 

docs/testing.md

@@ -145,7 +145,7 @@ Playwright is a testing framework that lets you automate Chromium, Firefox, and
 
 ### Quickstart
 
-The fastest way to get started, is to use `create-next-app` with the [with-playwright example](https://github.com/vercel/next.js/tree/canary/examples/with-playwright). This will create a Next.js project complete with Playwright all set up.
+The fastest way to get started is to use `create-next-app` with the [with-playwright example](https://github.com/vercel/next.js/tree/canary/examples/with-playwright). This will create a Next.js project complete with Playwright all setup.
 
 ```bash
 npx create-next-app@latest --example with-playwright with-playwright-app
@@ -214,7 +214,7 @@ test('should navigate to the about page', async ({ page }) => {
   await page.goto('http://localhost:3000/')
   // Find an element with the text 'About Page' and click on it
   await page.click('text=About')
-  // The new url should be "/about" (baseURL is used there)
+  // The new URL should be "/about" (baseURL is used there)
   await expect(page).toHaveURL('http://localhost:3000/about')
   // The new page should contain an h1 with "About Page"
   await expect(page.locator('h1')).toContainText('About Page')
@@ -261,7 +261,7 @@ npx create-next-app@latest --example with-jest with-jest-app
 
 ### Setting up Jest (with the Rust Compiler)
 
-Since the release of [Next.js 12](https://nextjs.org/blog/next-12), Next.js now has built-in configuration for Jest.
+Since the release of [Next.js 12](https://nextjs.org/blog/next-12), Next.js now has a built-in configuration for Jest.
 
 To set up Jest, install `jest`, `jest-environment-jsdom`, `@testing-library/react`, `@testing-library/jest-dom`:
 
@@ -290,7 +290,7 @@ const customJestConfig = {
   testEnvironment: 'jest-environment-jsdom',
 }
 
-// createJestConfig is exported this way to ensure that next/jest can load the Next.js config which is async
+// createJestConfig is exported this way to ensure that next/jest can load the Next.js config which is an async
 module.exports = createJestConfig(customJestConfig)
 ```
 
@@ -307,7 +307,7 @@ Under the hood, `next/jest` is automatically configuring Jest for you, including
 
 ### Setting up Jest (with Babel)
 
-If you opt-out of the [Rust Compiler](https://nextjs.org/docs/advanced-features/compiler), you will need to manually configure Jest and install `babel-jest` and `identity-obj-proxy` in addition to the packages above.
+If you opt out of the [Rust Compiler](https://nextjs.org/docs/advanced-features/compiler), you will need to manually configure Jest and install `babel-jest` and `identity-obj-proxy` in addition to the packages above.
 
 Here are the recommended options to configure Jest for Next.js:
 
@@ -380,9 +380,9 @@ module.exports = {}
 
 For more information on handling static assets, please refer to the [Jest Docs](https://jestjs.io/docs/webpack#handling-static-assets).
 
-**Optional: Extend Jest with custom matchers**
+**Optional: Extend Jest with custom matches**
 
-`@testing-library/jest-dom` includes a set of convenient [custom matchers](https://github.com/testing-library/jest-dom#custom-matchers) such as `.toBeInTheDocument()` making it easier to write tests. You can import the custom matchers for every test by adding the following option to the Jest configuration file:
+`@testing-library/jest-dom` includes a set of convenient [custom matches](https://github.com/testing-library/jest-dom#custom-matchers) such as `.toBeInTheDocument()` making it easier to write tests. You can import the custom matches for every test by adding the following option to the Jest configuration file:
 
 ```js
 // jest.config.js
@@ -440,7 +440,7 @@ Add the Jest executable in watch mode to the `package.json` scripts:
 
 **Create your first tests**
 
-Your project is now ready to run tests. Follow Jests convention by adding tests to the `__tests__` folder in your project's root directory.
+Your project is now ready to run tests. Follow the Jests convention by adding tests to the `__tests__` folder in your project's root directory.
 
 For example, we can add a test to check if the `<Home />` component successfully renders a heading:
 

docs/upgrading.md

@@ -14,7 +14,7 @@ If you were using Middleware prior to `12.2`, please see the [upgrade guide](htt
 
 The minimum Node.js version has been bumped from 12.0.0 to 12.22.0 which is the first version of Node.js with native ES Modules support.
 
-### Upgrade React version to latest
+### Upgrade React version to the latest
 
 The minimum required React version is `17.0.2`. To upgrade you can run the following command in the terminal:
 
@@ -44,9 +44,9 @@ yarn add next@12
 
 ### SWC replacing Babel
 
-Next.js now uses Rust-based compiler [SWC](https://swc.rs/) to compile JavaScript/TypeScript. This new compiler is up to 17x faster than Babel when compiling individual files and up to 5x faster Fast Refresh.
+Next.js now uses Rust-based compiler, [SWC](https://swc.rs/) to compile JavaScript/TypeScript. This new compiler is up to 17x faster than Babel when compiling individual files and up to 5x faster than Fast Refresh.
 
-Next.js provides full backwards compatibility with applications that have [custom Babel configuration](https://nextjs.org/docs/advanced-features/customizing-babel-config). All transformations that Next.js handles by default like styled-jsx and tree-shaking of `getStaticProps` / `getStaticPaths` / `getServerSideProps` have been ported to Rust.
+Next.js provides full backward compatibility with applications that have [custom Babel configuration](https://nextjs.org/docs/advanced-features/customizing-babel-config). All transformations that Next.js handles by default like styled-jsx and tree-shaking of `getStaticProps` / `getStaticPaths` / `getServerSideProps` have been ported to Rust.
 
 When an application has a custom Babel configuration, Next.js will automatically opt-out of using SWC for compiling JavaScript/Typescript and will fall back to using Babel in the same way that it was used in Next.js 11.
 
@@ -72,15 +72,15 @@ Minification using SWC is an opt-in flag to ensure it can be tested against more
 
 ### Improvements to styled-jsx CSS parsing
 
-On top of the Rust-based compiler we've implemented a new CSS parser based on the CSS parser that was used for the styled-jsx Babel transform. This new parser has improved handling of CSS and now errors when invalid CSS is used that would previously slip through and cause unexpected behavior.
+On top of the Rust-based compiler we've implemented a new CSS parser based on the CSS parser that was used for the styled-jsx Babel transform. This new parser has improved the handling of CSS and now errors when invalid CSS is used that would previously slip through and cause unexpected behavior.
 
-Because of this change invalid CSS will throw an error during development and `next build`. This change only affects styled-jsx usage.
+Because of this change, invalid CSS will throw an error during development and the `next build`. This change only affects styled-jsx usage.
 
 ### `next/image` changed wrapping element
 
 `next/image` now renders the `<img>` inside a `<span>` instead of `<div>`.
 
-If your application has specific CSS targeting span, for example `.container span`, upgrading to Next.js 12 might incorrectly match the wrapping element inside the `<Image>` component. You can avoid this by restricting the selector to a specific class such as `.container span.item` and updating the relevant component with that className, such as `<span className="item" />`.
+If your application has a specific CSS targeting span, for example, `.container span`, upgrading to Next.js 12 might incorrectly match the wrapping element inside the `<Image>` component. You can avoid this by restricting the selector to a specific class such as `.container span.item` and updating the relevant component with that className, such as `<span className="item" />`.
 
 If your application has specific CSS targeting the `next/image` `<div>` tag, for example `.container div`, it may not match anymore. You can update the selector `.container span`, or preferably, add a new `<div className="wrapper">` wrapping the `<Image>` component and target that instead such as `.container .wrapper`.
 
@@ -117,21 +117,21 @@ If you are already using webpack 5 you can skip this section.
 
 Next.js has adopted webpack 5 as the default for compilation in Next.js 11. As communicated in the [webpack 5 upgrading documentation](https://nextjs.org/docs/messages/webpack5) Next.js 12 removes support for webpack 4.
 
-If your application is still using webpack 4 using the opt-out flag you will now see an error linking to the [webpack 5 upgrading documentation](https://nextjs.org/docs/messages/webpack5).
+If your application is still using webpack 4 using the opt out flag you will now see an error linking to the [webpack 5 upgrading documentation](https://nextjs.org/docs/messages/webpack5).
 
 ### `target` option deprecated
 
-If you do not have `target` in `next.config.js` you can skip this section.
+If you do not have a `target` in `next.config.js` you can skip this section.
 
 The target option has been deprecated in favor of built-in support for tracing what dependencies are needed to run a page.
 
-During `next build`, Next.js will automatically trace each page and its dependencies to determine all of the files that are needed for deploying a production version of your application.
+During the `next build`, Next.js will automatically trace each page and its dependencies to determine all of the files that are needed for deploying a production version of your application.
 
 If you are currently using the `target` option set to `serverless` please read the [documentation on how to leverage the new output](https://nextjs.org/docs/advanced-features/output-file-tracing).
 
 ## Upgrading from version 10 to 11
 
-### Upgrade React version to latest
+### Upgrade React version to the latest
 
 Most applications already use the latest version of React, with Next.js 11 the minimum React version has been updated to 17.0.2.
 
@@ -163,7 +163,7 @@ yarn add next@11
 
 ### Webpack 5
 
-Webpack 5 is now the default for all Next.js applications. If you did not have custom webpack configuration your application is already using webpack 5. If you do have custom webpack configuration you can refer to the [Next.js webpack 5 documentation](https://nextjs.org/docs/messages/webpack5) for upgrading guidance.
+Webpack 5 is now the default for all Next.js applications. If you did not have a custom webpack configuration your application is already using webpack 5. If you do have a custom webpack configuration you can refer to the [Next.js webpack 5 documentation](https://nextjs.org/docs/messages/webpack5) for upgrading guidance.
 
 ### Cleaning the `distDir` is now a default
 
@@ -213,7 +213,7 @@ You can learn more in [the documentation](https://nextjs.org/docs/messages/url-d
 
 ### Remove `unsized` property on `next/image`
 
-The `unsized` property on `next/image` was deprecated in Next.js 10.0.1. You can use `layout="fill"` instead. In Next.js 11 `unsized` was removed.
+The `unsized` property on `next/image` was deprecated in Next.js 10.0.1. You can use `layout="fill"` instead. In Next.js 11 `unsized` were removed.
 
 ### Remove `modules` property on `next/dynamic`
 
@@ -227,7 +227,7 @@ If your application does use `modules` and `render` you can refer to [the docume
 
 `Head.rewind` has been a no-op since Next.js 9.5, in Next.js 11 it was removed. You can safely remove your usage of `Head.rewind`.
 
-### Moment.js locales excluded by default
+### Moment.js locales are excluded by default
 
 Moment.js includes translations for a lot of locales by default. Next.js now automatically excludes these locales by default to optimize bundle size for applications using Moment.js.
 
@@ -244,7 +244,7 @@ You can opt-out of this new default by adding `excludeDefaultMomentLocales: fals
 
 ### Update usage of `router.events`
 
-In case you're accessing `router.events` during rendering, in Next.js 11 `router.events` is no longer provided during pre-rendering. Ensure you're accessing `router.events` in `useEffect`:
+In case you're accessing `router.events` during rendering, in Next.js 11 `router.events` are no longer provided during pre-rendering. Ensure you're accessing `router.events` in `useEffect`:
 
 ```js
 useEffect(() => {
@@ -274,7 +274,7 @@ React 17 introduced a new [JSX Transform](https://reactjs.org/blog/2020/09/22/in
 
 ## Upgrading from version 9 to 10
 
-There were no breaking changes between version 9 and 10.
+There were no breaking changes between versions 9 and 10.
 
 To upgrade run the following command:
 
@@ -341,7 +341,7 @@ TypeScript Definitions are published with the `next` package, so you need to uni
 
 The following types are different:
 
-> This list was created by the community to help you upgrade, if you find other differences please send a pull-request to this list to help other users.
+> This list was created by the community to help you upgrade, if you find other differences please send a pull request to this list to help other users.
 
 From:
 
@@ -359,7 +359,7 @@ import { AppContext, AppInitialProps } from 'next/app'
 import { DocumentContext, DocumentInitialProps } from 'next/document'
 ```
 
-#### The `config` key is now an export on a page
+#### The `config` key is now export on a page
 
 You may no longer export a custom variable named `config` from a page (i.e. `export { config }` / `export const config ...`).
 This exported variable is now used to specify page-level Next.js configuration like Opt-in AMP and API Route features.
@@ -385,7 +385,7 @@ const DynamicComponentWithCustomLoading = dynamic(
 
 Next.js now has the concept of page-level configuration, so the `withAmp` higher-order component has been removed for consistency.
 
-This change can be **automatically migrated by running the following commands in the root of your Next.js project:**
+This change can be **automatically migrated by running the following commands at the root of your Next.js project:**
 
 ```bash
 curl -L https://github.com/vercel/next-codemod/archive/master.tar.gz | tar -xz --strip=2 next-codemod-master/transforms/withamp-to-config.js npx jscodeshift -t ./withamp-to-config.js pages/**/*.js

packages/next/README.md

@@ -46,7 +46,7 @@ Please see our [contributing.md](/contributing.md).
 
 ### Good First Issues
 
-We have a list of [good first issues](https://github.com/vercel/next.js/labels/good%20first%20issue) that contain bugs which have a relatively limited scope. This is a great place to get started, gain experience, and get familiar with our contribution process.
+We have a list of [good first issues](https://github.com/vercel/next.js/labels/good%20first%20issue) that contain bugs that have a relatively limited scope. This is a great place to get started, gain experience, and get familiar with our contribution process.
 
 ## Authors