Skip to content

Commit 94e018c

Browse files
ruisaraiva19ruisaraiva19
authored
Merge pull request #359 from tjallingt/canary
chore: release
2 parents 91a6609 + 714e4a9 commit 94e018c

File tree

14 files changed

+465
-89
lines changed

14 files changed

+465
-89
lines changed

‎.github/workflows/tests.yml‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ jobs:
88
name: Node.js ${{ matrix.node }}
99
strategy:
1010
matrix:
11-
node: ['14.x', '16.x', '17.x']
11+
node: ['14.x', '16.x', '17.x', '18.x']
1212
steps:
1313
- name: Checkout
1414
uses: actions/checkout@v3

‎package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@
2424
"husky": "7.0.4",
2525
"lint-staged": "12.3.7",
2626
"prettier": "2.6.2",
27-
"turbo": "1.2.5",
27+
"turbo": "1.2.12",
2828
"typescript": "4.6.3"
2929
},
3030
"lint-staged": {

‎packages/example-ssr/.gitignore‎

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
2+
3+
# dependencies
4+
/node_modules
5+
/.pnp
6+
.pnp.js
7+
8+
# testing
9+
/coverage
10+
11+
# next.js
12+
/.next/
13+
/out/
14+
15+
# production
16+
/build
17+
18+
# misc
19+
.DS_Store
20+
*.pem
21+
22+
# debug
23+
npm-debug.log*
24+
yarn-debug.log*
25+
yarn-error.log*
26+
.pnpm-debug.log*
27+
28+
# local env files
29+
.env*.local
30+
31+
# vercel
32+
.vercel
33+
34+
# typescript
35+
*.tsbuildinfo

‎packages/example-ssr/README.md‎

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
# react-youtube example ssr
2+
3+
This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).
4+
5+
## Getting Started
6+
7+
First, run the development server:
8+
9+
```bash
10+
npm run dev
11+
# or
12+
yarn dev
13+
```
14+
15+
Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
16+
17+
You can start editing the page by modifying `pages/index.tsx`. The page auto-updates as you edit the file.

‎packages/example-ssr/next-env.d.ts‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
/// <reference types="next" />
2+
/// <reference types="next/image-types/global" />
3+
4+
// NOTE: This file should not be edited
5+
// see https://nextjs.org/docs/basic-features/typescript for more information.

‎packages/example-ssr/next.config.js‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
/** @type {import('next').NextConfig} */
2+
const nextConfig = {
3+
reactStrictMode: true,
4+
};
5+
6+
module.exports = nextConfig;

‎packages/example-ssr/package.json‎

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
{
2+
"name": "react-youtube-example-ssr",
3+
"version": "1.0.0",
4+
"description": "react-youtube example ssr starter project",
5+
"scripts": {
6+
"dev": "next dev",
7+
"build": "next build",
8+
"start": "next start"
9+
},
10+
"dependencies": {
11+
"next": "12.1.6",
12+
"react": "18.1.0",
13+
"react-dom": "18.1.0",
14+
"react-youtube": "1.0.0"
15+
},
16+
"devDependencies": {
17+
"@types/node": "17.0.35",
18+
"@types/react": "18.0.9",
19+
"@types/react-dom": "18.0.5",
20+
"typescript": "4.6.3"
21+
}
22+
}

‎packages/example-ssr/pages/_app.tsx‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
import '../styles/globals.css';
2+
import type { AppProps } from 'next/app';
3+
4+
function MyApp({ Component, pageProps }: AppProps) {
5+
return <Component {...pageProps} />;
6+
}
7+
8+
export default MyApp;

‎packages/example-ssr/pages/index.tsx‎

Lines changed: 67 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,67 @@
1+
import { useState } from 'react';
2+
import YouTube, { YouTubePlayer } from 'react-youtube';
3+
import type { NextPage } from 'next';
4+
import Head from 'next/head';
5+
6+
const VIDEOS = ['XxVg_s8xAms', '-DX3vJiqxm4'];
7+
8+
const Home: NextPage = () => {
9+
const [player, setPlayer] = useState<YouTubePlayer>();
10+
const [videoIndex, setVideoIndex] = useState(0);
11+
const [width, setWidth] = useState(600);
12+
const [hidden, setHidden] = useState(false);
13+
const [autoplay, setAutoplay] = useState(false);
14+
15+
return (
16+
<div id="app">
17+
<Head>
18+
<title>react-youtube example ssr</title>
19+
</Head>
20+
<div style={{ display: 'flex', marginBottom: '1em' }}>
21+
<button type="button" onClick={() => player?.seekTo(120, true)}>
22+
Seek to 2 minutes
23+
</button>
24+
<button type="button" onClick={() => setVideoIndex((videoIndex + 1) % VIDEOS.length)}>
25+
Change video
26+
</button>
27+
<label>
28+
<input
29+
type="range"
30+
min="300"
31+
max="1080"
32+
value={width}
33+
onChange={(event) => setWidth(event.currentTarget.valueAsNumber)}
34+
/>
35+
Width ({width}px)
36+
</label>
37+
<button type="button" onClick={() => setHidden(!hidden)}>
38+
{hidden ? 'Show' : 'Hide'}
39+
</button>
40+
<label>
41+
<input type="checkbox" checked={autoplay} onChange={(event) => setAutoplay(event.currentTarget.checked)} />
42+
Autoplaying
43+
</label>
44+
</div>
45+
46+
{hidden ? (
47+
'mysterious'
48+
) : (
49+
// @ts-ignore
50+
<YouTube
51+
videoId={VIDEOS[videoIndex]}
52+
opts={{
53+
width,
54+
height: width * (9 / 16),
55+
playerVars: {
56+
autoplay: autoplay ? 1 : 0,
57+
},
58+
}}
59+
className="container"
60+
onReady={(event) => setPlayer(event.target)}
61+
/>
62+
)}
63+
</div>
64+
);
65+
};
66+
67+
export default Home;

‎packages/example-ssr/public/favicon.ico‎

25.3 KB
Binary file not shown.

0 commit comments

Comments
 (0)