Skip to content

Commit b6cd29c

Browse files
author
Ezaz
committed
Svelte props added
1 parent 4dac089 commit b6cd29c

1 file changed

Lines changed: 81 additions & 8 deletions

File tree

‎data/svete.json‎

Lines changed: 81 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -6,9 +6,15 @@
66
"colorPref": "#333",
77
"contents": [{
88
"title": "শুরু",
9-
"items": [{
9+
"items":
10+
[
11+
{
1012
"definition": "npm এর মাধ্যমে vite এর সাহায্যে ইন্সটল করতে",
11-
"code": "\n npm create vite@latest myapp -- --template svelte\n cd myapp\n npm install\n npm run dev"
13+
"code": "\nnpm create vite@latest myapp -- --template svelte\n cd myapp\n npm install\n npm run dev"
14+
},
15+
{
16+
"definition": "কম্পোনেন্ট ফরম্যাট",
17+
"code": "\n<script>\n\n // logic goes here\n</script>\n\n<!-- markup (zero or more items) goes here -->\n\n<style>\n /* styles go here */\n</style>"
1218
}
1319
]
1420
},
@@ -18,31 +24,98 @@
1824
[
1925
{
2026
"definition": "এসভেল্ট এ 'Hello world' প্রিন্ট করা",
21-
"code": "//App.svelte\n\n<h1>Hello world!</h1>"
27+
"code": "\n//App.svelte\n\n<h1>Hello world!</h1>"
2228
},
2329
{
2430
"definition": "ডাটা যুক্ত করা(ভ্যারিয়েবল ডিক্লেয়ার)",
25-
"code": "//App.svelte\n\n<script> \n let name = 'world';\n</script> \n\n<h1>Hello {name}!</h1>"
31+
"code": "\n//App.svelte\n\n<script> \n let name = 'world';\n</script> \n\n<h1>Hello {name}!</h1>"
2632
},
2733
{
2834
"definition": "ডায়ন্যামিক অ্যাট্রিবিউট",
29-
"code": "//App.svelte\n\n<script> \n let src = 'tutorial/image.gif', widht='100', height='100';\n</script> \n\n<img {src} {width} {height}>"
35+
"code": "\n//App.svelte\n\n<script> \n let src = 'tutorial/image.gif', widht='100', height='100';\n</script> \n\n<img {src} {width} {height}>"
3036
},
3137
{
3238
"definition": "কম্পোনেন্ট স্ট্যাইল",
33-
"code": "//App.svelte\n\n<p>This is a paragraph.</p>\n\n<style>\n p{\n color: purple;\n }\n</style>"
39+
"code": "\n//App.svelte\n\n<p>This is a paragraph.</p>\n\n<style>\n p{\n color: purple;\n }\n</style>"
3440
},
3541
{
3642
"definition": "নেস্টেড কম্পোনেন্ট",
3743
"code": [
38-
"//App.svelte\n\n<script>\n import NestedComponent from './Nested.svelte'; \n</script>\n\n<h2>I'm Parent Component</h2> \n<NestedComponent/> \n",
44+
"\n//App.svelte\n\n<script>\n import NestedComponent from './Nested.svelte'; \n</script>\n\n",
45+
"<h2>I'm Parent Component</h2> \n<NestedComponent/> \n",
3946
"\n//Nested.svelte \n\n<h2>I'm Nested Component</h2>"
4047
]
4148
},
4249
{
4350
"definition": "HTML ট্যাগস",
4451
"code": [
45-
"//App.svelte\n\n<script>\n let string = `this string contains some <strong>HTML!!!</strong>`; \n</script>\n\n<h2><p>{@html string}</p></h2>\n"
52+
"\n//App.svelte\n\n<script>\n let string = `this string contains some <strong>HTML!!!</strong>`; \n</script>\n\n",
53+
"<h2><p>{@html string}</p></h2>\n"
54+
]
55+
}
56+
]
57+
},
58+
{
59+
"title": "এসভেল্ট এর রিয়্যাক্টিভিটি",
60+
"items": [
61+
{
62+
"definition": "এসাইনমেন্ট (Assignment)",
63+
"code": [
64+
"\n//App.svelte \n\n<script>\n let count = 0; \n\n function incrementCount() {\n count += 1;\n }\n</script>\n\n",
65+
"<button on:click={incrementCount}>\n Clicked {count} {count === 1 ? 'time' : 'times'}\n</button>"
66+
]
67+
},
68+
{
69+
"definition": "ডিক্লারেশন (Declarations)",
70+
"code": [
71+
"\n//App.svelte \n\n<script>\n let count = 0; \n\n $: doubled = count * 2;\n\n function handleClick() {\n count += 1;\n }\n</script>\n\n",
72+
"<button on:click={handleClick}>\n Clicked {count} {count === 1 ? 'time' : 'times'}\n</button>\n\n<p>{count} doubled is {doubled}</p>"
73+
]
74+
},
75+
{
76+
"definition": "ষ্টেটমেন্ট (Statements)",
77+
"code": [
78+
"\n//App.svelte \n\n<script>\n let count = 0; \n\n $: if (count >= 10) {\n alert('count is dangerously high!');\n count = 9;\n }\n\n function handleClick() {\n count += 1;\n }\n</script>\n\n",
79+
"<button on:click={handleClick}> Clicked {count} {count === 1 ? 'time' : 'times'}</button>"
80+
]
81+
},
82+
{
83+
"definition": "অ্যারে এবং অবজেক্ট আপডেট",
84+
"code": [
85+
"\n//App.svelte \n\n<script>\n let numbers = [1, 2, 3, 4];\n\n function addNumber() {\n numbers = [...numbers, numbers.length + 1];\n }\n\n $: sum = numbers.reduce((t, n) => t + n, 0);\n</script>\n\n",
86+
"<p>{numbers.join(' + ')} = {sum}</p>\n\n<button on:click={addNumber}>\n Add a number\n</button>"
87+
]
88+
}
89+
]
90+
},
91+
{
92+
"title": "এসভেল্ট এর প্রপস (props)",
93+
"items": [
94+
{
95+
"definition": "প্রপস ডিক্লারেশন",
96+
"code": [
97+
"\n//App.svelte \n\n<script>\n import Nested from './Nested.svelte';\n</script>\n\n",
98+
"<Nested answer={42}/>\n",
99+
"\n//Nested.svelte \n\n<script>\n export let answer;\n</script>\n\n",
100+
"<p>The answer is {answer}</p>"
101+
]
102+
},
103+
{
104+
"definition": "প্রপস এর ডিফল্ট ভ্যালু",
105+
"code": [
106+
"\n//App.svelte \n\n<script>\n import Nested from './Nested.svelte';\n</script>\n\n",
107+
"<Nested answer={42}/>\n<Nested />\n",
108+
"\n//Nested.svelte \n\n<script>\n export let answer = 'a mystery';\n</script>\n\n",
109+
"<p>The answer is {answer}</p>"
110+
]
111+
},
112+
{
113+
"definition": "প্রপস স্প্রেড",
114+
"code": [
115+
"\n//App.svelte \n\n<script>\n import Info from './Info.svelte';\n const pkg = {\n name: 'svelte',\n version: 3,\n speed: 'blazing',\n website: 'https://devsonket.com'\n };\n</script>\n\n",
116+
"<Info {...pkg}/>\n",
117+
"\n//Info.svelte \n\n<script>\n export let name;\n export let version;\n export let speed;\n export let website;\n</script>\n\n",
118+
"<p>The <code>{name}</code> package is {speed} fast. Download version {version} from <a href='https://www.npmjs.com package/{name}'>npm</a> and <a href={website}>learn more here</p>"
46119
]
47120
}
48121
]

0 commit comments

Comments
 (0)