docs: add custom player page section to README #41
Conversation
- Added custom player page documentation - Included code example for @react-native-youtube-bridge/web usage - Added reference link to web player guide
|
WalkthroughA Babel configuration file was removed, and new MIT license files were added to two package directories. Documentation for the React Native YouTube Bridge and its web component was enhanced, including new and updated README files in both English and Korean, with improved instructions for customizing the WebView player and clearer usage examples. Changes
Poem
✨ Finishing Touches
🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
SupportNeed help? Create a ticket on our support page for assistance with any issues or questions. Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
Deploying react-native-youtube-bridge-example with
|
| Latest commit: |
f3cee3c
|
| Status: | ✅ Deploy successful! |
| Preview URL: | https://1fcef7b8.react-native-youtube-bridge-example.pages.dev |
| Branch Preview URL: | https://docs-improve-readme.react-native-youtube-bridge-example.pages.dev |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 0
🧹 Nitpick comments (8)
packages/web/README-ko_kr.md (1)
15-35: Add missing import & samplesourceto usage snippetNewcomers may copy-paste this code verbatim.
Withoutimport { YoutubePlayer }and a concretesourceexample the snippet will not compile, lowering doc quality.function App() { return ( <> {/* 방법 1: 인라인 HTML 사용 (기본값) */} - <YoutubePlayer + <YoutubePlayer + // import 필요: + // import { YoutubePlayer } from 'react-native-youtube-bridge'; source={source} useInlineHtml />Consider adding either:
import { YoutubePlayer } from 'react-native-youtube-bridge'; const source = { videoId: 'dQw4w9WgXcQ' };directly above the example.
packages/react-native-youtube-bridge/README-ko_kr.md (2)
241-245: Wrap bare URL to silence markdown-lint MD034Markdown-lint flags bare URLs; wrapping with angle brackets keeps the rendered output identical while fixing the warning.
- - 기본 URI는 https://react-native-youtube-bridge.pages.dev 입니다. + - 기본 URI는 <https://react-native-youtube-bridge.pages.dev> 입니다.
269-284: Use a proper heading instead of bold text (MD036)
markdownlintreports “Emphasis used instead of a heading”.
Convert the bold line to an H4 so it participates in the TOC.-**커스텀 플레이어 페이지** +#### 커스텀 플레이어 페이지packages/react-native-youtube-bridge/README.md (2)
243-245: Replace bare URL with angle-bracket formSame MD034 warning as in the Korean doc.
- - The default URI is https://react-native-youtube-bridge.pages.dev. + - The default URI is <https://react-native-youtube-bridge.pages.dev>.
269-284: Promote bold text to a real headingConsistent with the Korean README and to satisfy MD036.
-**Custom Player Page** +#### Custom Player Pagepackages/web/README.md (3)
1-1: Capitalize “YouTube” for brand consistencyThe project name is spelled “YouTube” elsewhere in the repo & README.
Recommend updating the heading to keep branding consistent.-# React Native Youtube Bridge Web +# React Native YouTube Bridge Web
15-35: Make the usage snippet self-containedThe example omits the
importforYoutubePlayer, andsourceis undefined, which may confuse readers copying it verbatim.+import { YoutubePlayer } from 'react-native-youtube-bridge'; // or the correct path + function App() { const source = { videoId: 'dQw4w9WgXcQ' }; // demo return ( <> {/* Method 1: Using inline HTML (default) */} <YoutubePlayer source={source} useInlineHtml /> {/* Method 2: Using external WebView page */} <YoutubePlayer source={source} useInlineHtml={false} // Default: https://react-native-youtube-bridge.pages.dev webViewUrl="https://your-custom-player.com" /> </> ) }
37-40: Tweak repetitive wording & clarify build stepSentence 37–40 repeats “default static site” phrasing and assumes readers know how to “build” a custom page.
Consider:The default external URL is
https://react-native-youtube-bridge.pages.dev.
If you’d prefer your own player page, build and host a page generated with@react-native-youtube-bridge/web, then pass its URL viawebViewUrl.
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (7)
babel.config.js(0 hunks)packages/react-native-youtube-bridge/LICENSE(1 hunks)packages/react-native-youtube-bridge/README-ko_kr.md(2 hunks)packages/react-native-youtube-bridge/README.md(2 hunks)packages/web/LICENSE(1 hunks)packages/web/README-ko_kr.md(1 hunks)packages/web/README.md(1 hunks)
💤 Files with no reviewable changes (1)
- babel.config.js
🧰 Additional context used
🪛 LanguageTool
packages/web/README.md
[style] ~39-~39: You have already used this phrasing in nearby sentences. Consider replacing it to add variety to your writing.
Context: ...ed as the external WebView URL. If you want to use your own custom player page, simply...
(REP_WANT_TO_VB)
🪛 markdownlint-cli2 (0.17.2)
packages/react-native-youtube-bridge/README.md
243-243: Bare URL used
null
(MD034, no-bare-urls)
269-269: Emphasis used instead of a heading
null
(MD036, no-emphasis-as-heading)
🔇 Additional comments (3)
packages/web/LICENSE (1)
1-21: MIT license addition looks goodThe full MIT text is present, including copyright and disclaimer sections.
No further action required.packages/react-native-youtube-bridge/LICENSE (1)
1-21: License file is correct and consistentIdentical MIT license text is added for the RN package, keeping licensing consistent across workspaces.
No issues spotted.packages/web/README.md (1)
69-71: Verify CONTRIBUTING path validity
./CONTRIBUTING.mdresolves relative topackages/web, but the contributing guide may live at repository root. Broken links frustrate readers.Please confirm the file exists at that relative path or update the link to the correct location.
Summary by CodeRabbit
Documentation
Chores