{

"id": "alpine-js-cheat-sheet",

"title": "আলপাইন জেএস",

"slug": "alpine-js-cheat-sheet",

"description": "আলপাইন জেএস চিটশিট",

"colorPref": "#78C1D2",

"contents": [{

"title": "Directives",

"items": [

{

"definition": "HTML এর একটি ব্লকের জন্য একটি নতুন আলপাইন কম্পোনেন্ট এবং এর ডেটা ঘোষণা করুন",

"code": "x-data"

},

{

"definition": "একটি উপাদানে গতিশীলভাবে এইচটিএমএল বৈশিষ্ট্য সেট করুন",

"code": "x-bind"

},

{

"definition": "একটি এলিমেন্টে ব্রাউজার ইভেন্ট লিসেনার",

"code": "x-on"

},

{

"definition": "একটি উপাদানের পাঠ্য বিষয়বস্তু সেট করুন",

"code": "x-text"

},

{

"definition": "একটি উপাদানের ভিতরের HTML সেট করুন",

"code": "x-html"

},

{

"definition": "একটি ইনপুট এলিমেন্টের সাথে এক টুকরো ডেটা সিঙ্ক্রোনাইজ করুন",

"code": "x-model"

},

{

"definition": "একটি উপাদানের দৃশ্যমানতা টগল করুন",

"code": "x-show"

},

{

"definition": "সিএসএস ট্রানজিশন ব্যবহার করে একটি উপাদানকে ভিতরে এবং বাইরে স্থানান্তর করুন",

"code": "x-transition"

},

{

"definition": "একটি ডাটা সেটের উপর ভিত্তি করে HTML এর একটি ব্লক পুনরাবৃত্তি করুন",

"code": "x-for"

},

{

"definition": "শর্তসাপেক্ষে পৃষ্ঠা থেকে সম্পূর্ণরূপে HTML এর একটি ব্লক যোগ/অপসারণ করুন।",

"code": "x-if"

},

{

"definition": "একটি উপাদান আলপাইন দ্বারা আরম্ভ করা হলে কোড চালান",

"code": "x-init"

},

{

"definition": "প্রতিবার তার একটি নির্ভরতা পরিবর্তনের সময় স্ক্রিপ্টটি চালান",

"code": "x-effect"

},

{

"definition": "$ Refs ম্যাজিক প্রপার্টি ব্যবহার করে সরাসরি তাদের নির্দিষ্ট কী দ্বারা রেফারেন্স উপাদান",

"code": "x-ref"

},

{

"definition": "এইচটিএমএল এর একটি ব্লক লুকান যতক্ষণ না আলপাইন এর বিষয়বস্তু আরম্ভ করা শেষ হয়",

"code": "x-cloak"

},

{

"definition": "এইচটিএমএল এর একটি ব্লককে আলপাইন দ্বারা আরম্ভ করা থেকে বিরত রাখুন",

"code": "x-ignore"

},

{

"definition": "বর্ণনা",

"code": "x-"

},

{

"definition": "x-id আপনাকে $id() ব্যবহার করে তৈরি করা যেকোনো নতুন আইডির জন্য একটি নতুন \"স্কোপ\" ঘোষণা করতে দেয়।",

"code": "x-id"

},

{

"definition": "আলপাইন টেমপ্লেটের অংশ সম্পূর্ণরূপে পৃষ্ঠার DOM-এর অন্য অংশে পরিবহন করতে ব্যবহৃত হয়।",

"code": "x-teleport"

}

]

},

{

"title": "Magic Properties",

"items": [

{

"definition": "Alpine.store (...) ব্যবহার করে নিবন্ধিত একটি বৈশ্বিক স্টোরে প্রবেশ করুন",

"code": "$store"

},

{

"definition": "বর্তমান DOM এলিমেন্ট উল্লেখ করুন",

"code": "$el"

},

{

"definition": "বর্তমান উপাদান থেকে একটি কাস্টম ব্রাউজার ইভেন্ট প্রেরণ করুন",

"code": "$dispatch"

},

{

"definition": "এক টুকরো ডেটা দেখুন এবং প্রদত্ত কলব্যাকটি যে কোন সময় পরিবর্তন করুন",

"code": "$watch"

},

{

"definition": "কী দ্বারা একটি উপাদান উল্লেখ করুন (x-ref ব্যবহার করে নির্দিষ্ট)",

"code": "$refs"

},

{

"definition": "কিছুটা কোড চালানোর জন্য পরবর্তী 'টিক' (ব্রাউজার পেইন্ট) পর্যন্ত অপেক্ষা করুন",

"code": "$nextTick"

},

{

"definition": "একটি ম্যাজিক প্রপার্টি যা যেকোনো আলপাইন উপাদানের মূল উপাদান পুনরুদ্ধার করতে ব্যবহার করা যেতে পারে।",

"code": "$root"

},

{

"definition": "একটি ম্যাজিক প্রপার্টি যা আপনাকে বর্তমান আলপাইন ডেটা স্কোপে অ্যাক্সেস দেয় (সাধারণত x-data দ্বারা সরবরাহ করা হয়)",

"code": "$data"

},

{

"definition": "একটি ম্যাজিক প্রপার্টি যা একটি এলিমেন্টের আইডি তৈরি করতে ব্যবহার করা যেতে পারে",

"code": "$id"

}

]

},

{

"title": "গ্লোবালস ( Globals )",

"items": [

{

"definition": "একটি ডেটা অবজেক্ট পুনরায় ব্যবহার করুন এবং এক্স-ডেটা ব্যবহার করে এটি উল্লেখ করুন",

"code": "Alpine.data"

},

{

"definition": "গ্লোবাল, রিয়েক্টিভ, ডেটার একটি অংশ ঘোষণা করুন যা $store ব্যবহার করে যে কোন জায়গা থেকে অ্যাক্সেস করা যায়",

"code": "Alpine.store"

},

{

"definition": "অ্যাপ্লিকেশনের মধ্যে x-bind অবজেক্টগুলিকে পুনরায় ব্যবহার করার একটি উপায় প্রদান করে।",

"code": "Alpine.bind"

}

]

}

]

}