Skip to content

Commit 7d0f84a

Browse files
Update README.md
1 parent 262a251 commit 7d0f84a

File tree

1 file changed

+70
-0
lines changed

1 file changed

+70
-0
lines changed

README.md

Lines changed: 70 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,4 +9,74 @@
99
* Fetches initial count of videos
1010
* Loads additional videos
1111

12+
## Usage
13+
14+
1. Clone repository
15+
```js
16+
https://github.com/dmitriyakkerman/vue-vuex-i18n-browser-sfc-starter.git
17+
```
18+
2. Install dependencies
19+
```js
20+
npm install
21+
```
22+
3. Import "YouTubeWidget" component in you app
23+
24+
```js
25+
<template>
26+
<div id="app">
27+
<YouTubeWidget apiKey="YOUR_API_KEY" channelId="YOUR_CHANNEL_ID"></YouTubeWidget>
28+
</div>
29+
</template>
30+
31+
<script>
32+
import YouTubeWidget from "./components/YouTubeWidget";
33+
34+
export default {
35+
name: 'App',
36+
components: {
37+
YouTubeWidget
38+
}
39+
}
40+
</script>
41+
42+
```
43+
44+
4. Configure component additional props if needed:
45+
46+
```js
47+
<template>
48+
<div id="app">
49+
<YouTubeWidget
50+
apiKey="YOUR_API_KEY"
51+
channelId="YOUR_CHANNEL_ID"
52+
:resultsPerRequest="4"
53+
:subscribersCountToFixed="1"
54+
subscribersCountText="подписчиков"
55+
subscribeBtnText="Подписаться"
56+
loadMoreBtnText="Загрузить еще"
57+
></YouTubeWidget>
58+
</div>
59+
</template>
60+
61+
...
62+
```
63+
64+
5. Import "YouTubeWidget" base styles from "main.scss"
65+
66+
```css
67+
...
68+
69+
<style lang="scss">
70+
@import "main.scss";
71+
</style>
72+
73+
```
74+
75+
6. Write your additional custom styles for widget.
76+
7. Run dev server:
77+
78+
```js
79+
npm run serve
80+
```
81+
8. Enjoy! 🎉
1282

0 commit comments

Comments
 (0)