Converted three more examples to TypeScript.
Changes to individual examples pushed as separate commits.
## Documentation / Examples
- [X] Make sure the linting passes by running `pnpm build && pnpm lint`
- [X] The "examples guidelines" are followed from [our contributing doc](https://github.com/vercel/next.js/blob/canary/contributing/examples/adding-examples.md)
This PR updates the minimum version of React used by examples from 17.0.2 to 18.2.0.
Fixes#41975
## Bug
- [x] Related issues linked using `fixes #41975`
- [ ] Integration tests added
- [ ] Errors have a 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 a helpful link attached, see `contributing.md`
## Documentation / Examples
- [x] Make sure the linting passes by running `pnpm build && pnpm lint`
- [x] The "examples guidelines" are followed from [our contributing doc](https://github.com/vercel/next.js/blob/canary/contributing/examples/adding-examples.md)
* Update upchunk to latest (2.3.1).
* Add mux-player package to package.json
* WIP: Make VideoPlayer return mux-player
* Remove unused code from prev video player
* Use mux-player-react directly
* Fix import line for mux-player-react
* chore: fix lint issues
This PR updates the docs and examples for `create-next-app` to include pnpm usage.
The following script was used to update every example README:
```js
const fs = require('fs')
const examples = fs.readdirSync('./examples')
for (let example of examples) {
const filename = `./examples/${example}/README.md`
const markdown = fs.readFileSync(filename, 'utf8')
const regex = new RegExp(`^yarn create next-app --example (.*)$`, 'gm')
const output = markdown.replace(regex, (yarn, group) => {
const pnpm = `pnpm create next-app -- --example ${group}`
return `${yarn}\n# or\n${pnpm}`
})
fs.writeFileSync(filename, output)
}
```
This PR removes the duplicate overview link for data fetching, and fixes the corresponding links
## 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 by running `yarn lint`
Co-authored-by: Lee Robinson <9113740+leerob@users.noreply.github.com>
Co-authored-by: JJ Kasper <22380829+ijjk@users.noreply.github.com>
Clean up package.json files in the `examples` directory:
- Add `private: true`
- Remove `version` (because they are irrelevant for packages that are not meant to be published)
- Remove `name` (because they are optional for packages that are not meant to be published, and when someone clones an example, they often rename it and the property becomes stale)
- Remove `author`
- Remove `description`
- Remove `license`
Also remove `with-dynamic-app-layout` example completely, since it does the same as `layout-component` (https://github.com/vercel/next.js/pull/27121#discussion_r668178408).
## Documentation / Examples
- [x] Make sure the linting passes
[With next 11 requiring react 17](https://nextjs.org/blog/next-11#upgrade-guide), most of the examples
need to be updated, so the following snippet updated all the examples to
a compatible react version.
```bash
cd examples/
fd -g 'package.json' | xargs sed -r -i 's/"react": ".*"/"react": "^17.0.2"/
fd -g 'package.json' | xargs sed -r -i 's/"react-dom": ".*"/"react-dom": "^17.0.2"/'
# exclude experimental react version
git checkout with-reason-relay/package.json
```
* yarn create next-app
* create an upload show page
* create upload page to handle in-progress upload and asset when it is ready
* move things to a layout component
* add some button styling
* poll for updates intelligently by dynamically setting refreshInterval on SWR hook
* better title
* edit gitignore, add MIT license use next 'latest'
based on feedback from https://github.com/zeit/next.js/pull/12723
* add some messages and spinner to make this a little nicer
* update README with environment variables info and Mux account info
* add .now to gitignore
* cleaner uploading state - redirect to /v/:playback_id when complete
* hardset image width in footer
* remove unused styles
* adjust title font size on mobile and adjust footer height on mobile
* use upchunk 1.0.8 so we don't have to dynamically load it
* cleaner error message handling
* fix brief error from returning Router on the render
* yarn lint-fix
* update README with note about .env.local
* add min height so the layout doesn't shift after selecting a file
* set poster attribute at video element
* use getStaticProps and fallback:true to render meta tags for social sharing
* create a pages/asset/:id route that we can be on while in the preparing state
* add copy about Mux, add twitter share widget
* add flash message about video ready for playback
* call it pre-rendered instead of server-side rendered
* pre-rendering, not server-side rendering
* Next.js not NextJS
* handle asset creation errors in the UI
* call hls.destroy() when the component is unmounted
* Updated readme and renamed .env.local
* Updated description
* add suggested patch with links to source code https://github.com/zeit/next.js/pull/13120#issuecomment-632858572
* Added vercel.json
* Updated some links
* Removed Prerequisites
Co-authored-by: Luis Alvarez <luis@vercel.com>
