diff --git a/README.md b/README.md index 6bc3429c..a5938649 100644 --- a/README.md +++ b/README.md @@ -4,7 +4,7 @@ vuejs বাংলা ডকুমেন্টেশন এ অবদান এর জন্য official vuejs-translations [discussions](https://github.com/vuejs-translations/guidelines/discussions/66) এ মন্তব্য করুন। -এই সাইটটি [VitePress](https://github.com/vuejs/vitepress) দিয়ে নির্মিত এবং [@vue/theme](https://github.com/vuejs/vue-theme) উপর নির্ভর করে । সাইটের বিষয়বস্তু Markdown ফরম্যাটে লেখা হয়েছে `src`। সাধারণ সম্পাদনার জন্য, আপনি সরাসরি GitHub-এ ফাইলটি সম্পাদনা করতে পারেন এবং একটি Pull Request তৈরি করতে পারেন। +এই সাইটটি [VitePress](https://github.com/vuejs/vitepress) দিয়ে নির্মিত এবং [@vue/theme](https://github.com/vuejs/vue-theme) উপর নির্ভর করে । সাইটের বিষয় অবজেক্ট Markdown ফরম্যাটে লেখা হয়েছে `src`। সাধারণ সম্পাদনার জন্য, আপনি সরাসরি GitHub-এ ফাইলটি সম্পাদনা করতে পারেন এবং একটি Pull Request তৈরি করতে পারেন। local development এর জন্য, প্যাকেজ ম্যানেজার হিসাবে [pnpm](https://pnpm.io/) ব্যবহার করা হয়েছে: @@ -15,7 +15,7 @@ pnpm run dev এই প্রকল্পের জন্য Node.js `v14.0.0` বা `v14.0.0+` প্রয়োজন কারণ আমরা আমাদের কোডে নতুন জাভাস্ক্রিপ্ট বৈশিষ্ট্য ব্যবহার করি, যেমন ঐচ্ছিক চেইনিং। -## বিষয়বস্তু নিয়ে কাজ করুন +## বিষয় অবজেক্ট নিয়ে কাজ করুন - VitePress ডকুমেন্টেশনে সমর্থিত [Markdown এক্সটেনশনগুলি](https://vitepress.vuejs.org/guide/markdown.html) এবং [Markdown এর ভিতরে Vue সিনট্যাক্স](https://vitepress.vuejs.org/guide/using-vue.html) কিভাবে ব্যবহার করা যায় দেখুন । diff --git a/src/about/community-guide.md b/src/about/community-guide.md index 43f74264..6b57ea4a 100644 --- a/src/about/community-guide.md +++ b/src/about/community-guide.md @@ -6,7 +6,7 @@ outline: deep Vue-এর সম্প্রদায় অবিশ্বাস্যভাবে দ্রুত বৃদ্ধি পাচ্ছে এবং আপনি যদি এটি পড়ছেন, তাহলে আপনি এতে যোগ দিতে প্রস্তুত হওয়ার একটি ভাল সুযোগ রয়েছে। তাই... স্বাগতম! -সম্প্রদায় আপনার জন্য কী করতে পারে এবং আপনি সম্প্রদায়ের জন্য কী করতে পারেন উভয়েরই এখন আমরা উত্তর দেব৷. +সম্প্রদায় আপনার জন্য কী করতে পারে এবং আপনি সম্প্রদায়ের জন্য কী করতে পারেন উভয়েরই এখন আমরা উত্তর দিব৷. ## সংস্থান {#resources} @@ -64,7 +64,7 @@ Vue কোর রিপোজিটরি একটি [কন্ট্রিব প্রশ্নগুলির উত্তর দেওয়া এবং ফোরাম এবং চ্যাটে সংস্থানগুলি ভাগ করা ছাড়াও, আপনি যা জানেন তা ভাগ এবং প্রসারিত করার আরও কয়েকটি কম সুস্পষ্ট উপায় রয়েছে: - **শিক্ষার উপকরণ তৈরি করুন।** প্রায়শই বলা হয় যে শেখার সর্বোত্তম উপায় হল শেখানো। যদি আপনি Vue এর সাথে আকর্ষণীয় কিছু করছেন, তাহলে একটি ব্লগ পোস্ট লিখে, একটি ওয়ার্কশপ তৈরি করে বা এমনকি সামাজিক মিডিয়াতে শেয়ার করা একটি সারাংশ প্রকাশ করে আপনার দক্ষতাকে শক্তিশালী করুন৷ -- **আপনার পছন্দের একটি রেপো দেখুন।** এটি আপনাকে বিজ্ঞপ্তি পাঠাবে যখনই সেই সংগ্রহস্থলে কার্যকলাপ থাকবে, যা আপনাকে চলমান আলোচনা এবং আসন্ন বৈশিষ্ট্য সম্পর্কে অভ্যন্তরীণ জ্ঞান দেবে। এটি দক্ষতা তৈরি করার একটি দুর্দান্ত উপায় যাতে আপনি শেষ পর্যন্ত সমস্যাগুলি সমাধান করতে এবং অনুরোধগুলি টানতে সহায়তা করতে সক্ষম হন। +- **আপনার পছন্দের একটি রেপো দেখুন।** এটি আপনাকে বিজ্ঞপ্তি পাঠাবে যখনই সেই সংগ্রহস্থলে কার্যকলাপ থাকবে, যা আপনাকে চলমান আলোচনা এবং আসন্ন বৈশিষ্ট্য সম্পর্কে অভ্যন্তরীণ জ্ঞান দিবে। এটি দক্ষতা তৈরি করার একটি দুর্দান্ত উপায় যাতে আপনি শেষ পর্যন্ত সমস্যাগুলি সমাধান করতে এবং অনুরোধগুলি টানতে সহায়তা করতে সক্ষম হন। ### ডক্স অনুবাদ করুন {#translate-docs} diff --git a/src/about/faq.md b/src/about/faq.md index f1484b54..9c84974c 100644 --- a/src/about/faq.md +++ b/src/about/faq.md @@ -8,7 +8,7 @@ Vue-এর উন্নয়ন প্রাথমিকভাবে স্প ## Vue 2 এবং Vue 3 এর মধ্যে পার্থক্য কী? {#what-s-the-difference-between-vue-2-and-vue-3} -Vue 3 হল Vue-এর বর্তমান, সর্বশেষ প্রধান সংস্করণ। এতে নতুন বৈশিষ্ট্য রয়েছে যা Vue 2-তে নেই, যেমন Teleport, Suspense, এবং প্রতি টেমপ্লেটের একাধিক রুট উপাদান। এটিতে ব্রেকিং পরিবর্তনগুলিও রয়েছে যা এটিকে Vue 2 এর সাথে বেমানান করে তোলে৷ সম্পূর্ণ বিবরণ [Vue 3 মাইগ্রেশন গাইড](https://v3-migration.vuejs.org/) এ নথিভুক্ত করা হয়েছে৷ +Vue 3 হল Vue-এর বর্তমান, সর্বশেষ প্রধান সংস্করণ। এতে নতুন বৈশিষ্ট্য রয়েছে যা Vue 2-তে নেই, যেমন Teleport, Suspense, এবং প্রতি টেমপ্লেটের একাধিক রুট কম্পোনেন্ট। এটিতে ব্রেকিং পরিবর্তনগুলিও রয়েছে যা এটিকে Vue 2 এর সাথে বেমানান করে তোলে৷ সম্পূর্ণ বিবরণ [Vue 3 মাইগ্রেশন গাইড](https://v3-migration.vuejs.org/) এ নথিভুক্ত করা হয়েছে৷ পার্থক্য থাকা সত্ত্বেও, Vue API-গুলির বেশিরভাগ দুটি প্রধান সংস্করণের মধ্যে ভাগ করা হয়, তাই আপনার Vue 2 জ্ঞানের বেশিরভাগ Vue 3-তে কাজ করতে থাকবে। উল্লেখযোগ্যভাবে, কম্পোজিশন API মূলত একটি Vue-3-শুধু বৈশিষ্ট্য ছিল, কিন্তু এখন হয়েছে Vue 2 এ ব্যাকপোর্ট করা হয়েছে এবং [Vue 2.7](https://github.com/vuejs/vue/blob/main/CHANGELOG.md#270-2022-07-01) এ উপলব্ধ। @@ -56,13 +56,13 @@ Vue 3 হল সবচেয়ে কার্যকরী মূলধার একটি বিল্ড টুল ছাড়া Vue ব্যবহার করার সময়, আমরা শুধুমাত্র গাছ-কাঁপানো হারাই না, কিন্তু ব্রাউজারে টেমপ্লেট কম্পাইলার পাঠাতে হয়। এটি প্রায় **41kb** আকারে ফুলে যায়। তাই, আপনি যদি প্রাথমিকভাবে বিল্ড স্টেপ ছাড়াই প্রগতিশীল বর্ধনের জন্য Vue ব্যবহার করেন, তাহলে পরিবর্তে [petite-vue](https://github.com/vuejs/petite-vue) (শুধু **6kb**) ব্যবহার করার কথা বিবেচনা করুন। -কিছু ফ্রেমওয়ার্ক, যেমন Svelte, একটি সংকলন কৌশল ব্যবহার করে যা একক-কম্পোনেন্ট পরিস্থিতিতে অত্যন্ত লাইটওয়েট আউটপুট তৈরি করে। যাইহোক, [আমাদের গবেষণা](https://github.com/yyx990803/vue-svelte-size-analysis) দেখায় যে আকারের পার্থক্যটি প্রয়োগের উপাদানগুলির সংখ্যার উপর নির্ভর করে। যদিও Vue এর একটি ভারী বেসলাইন আকার রয়েছে, এটি প্রতি উপাদানের কম কোড তৈরি করে। বাস্তব-বিশ্বের পরিস্থিতিতে, একটি Vue অ্যাপ খুব হালকা হতে পারে। +কিছু ফ্রেমওয়ার্ক, যেমন Svelte, একটি সংকলন কৌশল ব্যবহার করে যা একক- কম্পোনেন্ট পরিস্থিতিতে অত্যন্ত লাইটওয়েট আউটপুট তৈরি করে। যাইহোক, [আমাদের গবেষণা](https://github.com/yyx990803/vue-svelte-size-analysis) দেখায় যে আকারের পার্থক্যটি প্রয়োগের কম্পোনেন্টগুলির সংখ্যার উপর নির্ভর করে। যদিও Vue এর একটি ভারী বেসলাইন আকার রয়েছে, এটি প্রতি কম্পোনেন্টের কম কোড তৈরি করে। বাস্তব-বিশ্বের পরিস্থিতিতে, একটি Vue অ্যাপ খুব হালকা হতে পারে। ## Vue স্কেল করে? {#does-vue-scale} হ্যাঁ. একটি সাধারণ ভুল ধারণা থাকা সত্ত্বেও Vue শুধুমাত্র সাধারণ ব্যবহারের ক্ষেত্রে উপযুক্ত, Vue বড় আকারের অ্যাপ্লিকেশনগুলি পরিচালনা করতে পুরোপুরি সক্ষম: -- [একক-ফাইল উপাদান](/guide/scaling-up/sfc) একটি মডুলারাইজড ডেভেলপমেন্ট মডেল প্রদান করে যা একটি অ্যাপ্লিকেশনের বিভিন্ন অংশকে বিচ্ছিন্নভাবে বিকাশ করতে দেয়। +- [একক-ফাইল- কম্পোনেন্ট](/guide/scaling-up/sfc) একটি মডুলারাইজড ডেভেলপমেন্ট মডেল প্রদান করে যা একটি অ্যাপ্লিকেশনের বিভিন্ন অংশকে বিচ্ছিন্নভাবে বিকাশ করতে দেয়। - [কম্পোজিশন এপিআই](/guide/reusability/composables) প্রথম শ্রেণীর টাইপস্ক্রিপ্ট ইন্টিগ্রেশন প্রদান করে এবং জটিল লজিক সংগঠিত, নিষ্কাশন এবং পুনরায় ব্যবহার করার জন্য পরিষ্কার প্যাটার্ন সক্ষম করে। @@ -76,7 +76,7 @@ Vue 3 হল সবচেয়ে কার্যকরী মূলধার ## আমার কি Options API বা Composition API ব্যবহার করা উচিত? {#should-i-use-options-api-or-composition-api} -আপনি যদি Vue-তে নতুন হন, আমরা দুটি শৈলীর মধ্যে একটি উচ্চ-স্তরের তুলনা প্রদান করি [এখানে](/guide/introduction#which-to-choose). +আপনি যদি Vue-তে নতুন হন, আমরা দুটি স্টাইলর মধ্যে একটি উচ্চ-স্তরের তুলনা প্রদান করি [এখানে](/guide/introduction#which-to-choose). আপনি যদি পূর্বে অপশন এপিআই ব্যবহার করে থাকেন এবং বর্তমানে কম্পোজিশন এপিআই মূল্যায়ন করছেন, [প্রায়শই জিজ্ঞাসিত প্রশ্ন](/guide/extras/composition-api-faq) দেখুন। @@ -92,9 +92,9 @@ TypeScript গ্রহণের সাথে অনবোর্ডিং জট ওয়েব কম্পোনেন্টগুলি স্থানীয়ভাবে উপলব্ধ হওয়ার আগে Vue তৈরি করা হয়েছিল এবং Vue এর ডিজাইনের কিছু দিক (যেমন slots) ওয়েব কম্পোনেন্ট মডেল দ্বারা অনুপ্রাণিত হয়েছিল। -ওয়েব কম্পোনেন্ট স্পেক্স তুলনামূলকভাবে নিম্ন-স্তরের, কারণ সেগুলি কাস্টম উপাদানগুলিকে সংজ্ঞায়িত করার চারপাশে কেন্দ্রীভূত। একটি কাঠামো হিসাবে, Vue অতিরিক্ত উচ্চ-স্তরের উদ্বেগগুলি যেমন দক্ষ DOM রেন্ডারিং, প্রতিক্রিয়াশীল রাষ্ট্র পরিচালনা, টুলিং, ক্লায়েন্ট-সাইড রাউটিং এবং সার্ভার-সাইড রেন্ডারিং এর সমাধান করে। +ওয়েব কম্পোনেন্ট স্পেক্স তুলনামূলকভাবে নিম্ন-স্তরের, কারণ সেগুলি কাস্টম কম্পোনেন্টগুলিকে সংজ্ঞায়িত করার চারপাশে কেন্দ্রীভূত। একটি কাঠামো হিসাবে, Vue অতিরিক্ত উচ্চ-স্তরের উদ্বেগগুলি যেমন দক্ষ DOM রেন্ডারিং, প্রতিক্রিয়াশীল রাষ্ট্র পরিচালনা, টুলিং, ক্লায়েন্ট-সাইড রাউটিং এবং সার্ভার-সাইড রেন্ডারিং এর সমাধান করে। -Vue সম্পূর্ণরূপে নেটিভ কাস্টম উপাদানগুলিতে ব্যবহার বা রপ্তানিকে সমর্থন করে - আরও বিশদ বিবরণের জন্য [Vue এবং ওয়েব উপাদান নির্দেশিকা](/guide/extras/web-components) দেখুন। +Vue সম্পূর্ণরূপে নেটিভ কাস্টম কম্পোনেন্টগুলিতে ব্যবহার বা রপ্তানিকে সমর্থন করে - আরও বিশদ বিবরণের জন্য [Vue এবং ওয়েব কম্পোনেন্ট নির্দেশিকা](/guide/extras/web-components) দেখুন। diff --git a/src/about/releases.md b/src/about/releases.md index 519f596c..14cbbcc4 100644 --- a/src/about/releases.md +++ b/src/about/releases.md @@ -52,7 +52,7 @@ Vue রিলিজগুলি কয়েকটি প্রান্তে Vue কম্পাইলারের একটি নতুন **অপ্রধান** সংস্করণ এমন কোড তৈরি করতে পারে যা একটি পুরানো ছোট সংস্করণ থেকে Vue রানটাইমের সাথে সামঞ্জস্যপূর্ণ নয়। উদাহরণস্বরূপ, Vue 3.2 কম্পাইলার দ্বারা উত্পন্ন কোড Vue 3.1 থেকে রানটাইম দ্বারা ব্যবহার করা হলে সম্পূর্ণরূপে সামঞ্জস্যপূর্ণ নাও হতে পারে। -এটি শুধুমাত্র লাইব্রেরি লেখকদের জন্য উদ্বেগের বিষয়, কারণ অ্যাপ্লিকেশনগুলিতে, কম্পাইলার সংস্করণ এবং রানটাইম সংস্করণ সর্বদা একই। একটি সংস্করণের অমিল শুধুমাত্র তখনই ঘটতে পারে যখন আপনি একটি প্যাকেজ হিসাবে প্রি-কম্পাইল করা Vue উপাদান কোড পাঠান এবং একজন ভোক্তা Vue-এর একটি পুরানো সংস্করণ ব্যবহার করে একটি প্রকল্পে এটি ব্যবহার করে। ফলস্বরূপ, আপনার প্যাকেজটি স্পষ্টভাবে Vue-এর একটি ন্যূনতম প্রয়োজনীয় ছোট সংস্করণ ঘোষণা করতে হতে পারে। +এটি শুধুমাত্র লাইব্রেরি লেখকদের জন্য উদ্বেগের বিষয়, কারণ অ্যাপ্লিকেশনগুলিতে, কম্পাইলার সংস্করণ এবং রানটাইম সংস্করণ সর্বদা একই। একটি সংস্করণের অমিল শুধুমাত্র তখনই ঘটতে পারে যখন আপনি একটি প্যাকেজ হিসাবে প্রি-কম্পাইল করা Vue কম্পোনেন্ট কোড পাঠান এবং একজন ভোক্তা Vue-এর একটি পুরানো সংস্করণ ব্যবহার করে একটি প্রকল্পে এটি ব্যবহার করে। ফলস্বরূপ, আপনার প্যাকেজটি স্পষ্টভাবে Vue-এর একটি ন্যূনতম প্রয়োজনীয় ছোট সংস্করণ ঘোষণা করতে হতে পারে। ## প্রি রিলিজ {#pre-releases} diff --git a/src/api/application.md b/src/api/application.md index 8d008ef1..0a65bd99 100644 --- a/src/api/application.md +++ b/src/api/application.md @@ -175,7 +175,7 @@ Installs a [plugin](/guide/reusability/plugins). প্রথম আর্গুমেন্ট হিসাবে প্লাগইন এবং দ্বিতীয় আর্গুমেন্ট হিসাবে ঐচ্ছিক প্লাগইন অপশন আশা করে। - প্লাগইনটি হয় একটি `ইনস্টল()` পদ্ধতি সহ একটি বস্তু হতে পারে, অথবা শুধুমাত্র একটি ফাংশন যা `ইনস্টল()` পদ্ধতি হিসেবে ব্যবহার করা হবে। বিকল্পগুলি (`app.use()` এর দ্বিতীয় আর্গুমেন্ট) প্লাগইনের `ইনস্টল()` পদ্ধতিতে পাস করা হবে। + প্লাগইনটি হয় একটি `ইনস্টল()` পদ্ধতি সহ একটি অবজেক্ট হতে পারে, অথবা শুধুমাত্র একটি ফাংশন যা `ইনস্টল()` পদ্ধতি হিসেবে ব্যবহার করা হবে। বিকল্পগুলি (`app.use()` এর দ্বিতীয় আর্গুমেন্ট) প্লাগইনের `ইনস্টল()` পদ্ধতিতে পাস করা হবে। একই প্লাগইনে যখন `app.use()` একাধিকবার কল করা হয়, প্লাগইনটি একবার ইন্সটল করা হবে। @@ -426,7 +426,7 @@ Vue থেকে রানটাইম সতর্কতার জন্য এ ## app.config.compilerOptions {#app-config-compileroptions} -রানটাইম কম্পাইলার বিকল্পগুলি কনফিগার করুন। এই অবজেক্টে সেট করা মানগুলি ইন-ব্রাউজার টেমপ্লেট কম্পাইলারে পাঠানো হবে এবং কনফিগার করা অ্যাপের প্রতিটি উপাদানকে প্রভাবিত করবে। মনে রাখবেন আপনি [`compilerOptions` বিকল্প](/api/options-rendering#compileroptions) ব্যবহার করে প্রতি-কম্পোনেন্ট ভিত্তিতে এই বিকল্পগুলিকে ওভাররাইড করতে পারেন। +রানটাইম কম্পাইলার বিকল্পগুলি কনফিগার করুন। এই অবজেক্টে সেট করা মানগুলি ইন-ব্রাউজার টেমপ্লেট কম্পাইলারে পাঠানো হবে এবং কনফিগার করা অ্যাপের প্রতিটি উপাদানকে প্রভাবিত করবে। মনে রাখবেন আপনি [`compilerOptions` বিকল্প](/api/options-rendering#compileroptions) ব্যবহার করে প্রতি- কম্পোনেন্ট ভিত্তিতে এই বিকল্পগুলিকে ওভাররাইড করতে পারেন। ::: warning গুরুত্বপূর্ণ এই কনফিগার বিকল্পটি শুধুমাত্র সম্পূর্ণ বিল্ড ব্যবহার করার সময় সম্মান করা হয় (অর্থাৎ স্বতন্ত্র `vue.js` যা ব্রাউজারে টেমপ্লেট কম্পাইল করতে পারে)। আপনি যদি বিল্ড সেটআপের সাথে রানটাইম-অনলি বিল্ড ব্যবহার করেন, তাহলে কম্পাইলার বিকল্পগুলি অবশ্যই বিল্ড টুল কনফিগারেশনের মাধ্যমে `@vue/compiler-dom`-এ পাস করতে হবে। @@ -512,7 +512,7 @@ Vue থেকে রানটাইম সতর্কতার জন্য এ - **বিস্তারিত** - ডিফল্টরূপে, Vue প্রোডাকশনে মন্তব্যগুলি সরিয়ে দেবে। এই বিকল্পটিকে `true` তে সেট করা Vue কে এমনকি উৎপাদনেও মন্তব্য সংরক্ষণ করতে বাধ্য করবে। মন্তব্য সবসময় উন্নয়নের সময় সংরক্ষিত হয়. এই বিকল্পটি সাধারণত ব্যবহৃত হয় যখন Vue অন্যান্য লাইব্রেরির সাথে ব্যবহার করা হয় যা HTML মন্তব্যের উপর নির্ভর করে। + ডিফল্টরূপে, Vue প্রোডাকশনে মন্তব্যগুলি সরিয়ে দিবে। এই বিকল্পটিকে `true` তে সেট করা Vue কে এমনকি উৎপাদনেও মন্তব্য সংরক্ষণ করতে বাধ্য করবে। মন্তব্য সবসময় উন্নয়নের সময় সংরক্ষিত হয়. এই বিকল্পটি সাধারণত ব্যবহৃত হয় যখন Vue অন্যান্য লাইব্রেরির সাথে ব্যবহার করা হয় যা HTML মন্তব্যের উপর নির্ভর করে। - **উদাহরণ** @@ -522,7 +522,7 @@ Vue থেকে রানটাইম সতর্কতার জন্য এ ## app.config.globalProperties {#app-config-globalproperties} -একটি বস্তু যা বিশ্বব্যাপী বৈশিষ্ট্য নিবন্ধন করতে ব্যবহার করা যেতে পারে যা অ্যাপ্লিকেশনের ভিতরে যেকোন উপাদানের উদাহরণে অ্যাক্সেস করা যেতে পারে। +একটি অবজেক্ট যা বিশ্বব্যাপী বৈশিষ্ট্য নিবন্ধন করতে ব্যবহার করা যেতে পারে যা অ্যাপ্লিকেশনের ভিতরে যেকোন উপাদানের উদাহরণে অ্যাক্সেস করা যেতে পারে। - **প্রকার** @@ -536,7 +536,7 @@ Vue থেকে রানটাইম সতর্কতার জন্য এ এটি Vue 2 এর `Vue.prototype` এর একটি প্রতিস্থাপন যা এখন আর Vue 3 তে নেই। বৈশ্বিক যেকোনো কিছুর মতো, এটিকে অল্প ব্যবহার করা উচিত। - যদি একটি বৈশ্বিক সম্পত্তি একটি উপাদানের নিজস্ব সম্পত্তির সাথে দ্বন্দ্ব করে, তবে উপাদানটির নিজস্ব সম্পত্তির অগ্রাধিকার থাকবে। + যদি একটি বৈশ্বিক কম্পিউটেড প্রপার্টি একটি উপাদানের নিজস্ব কম্পিউটেড প্রপার্টির সাথে দ্বন্দ্ব করে, তবে উপাদানটির নিজস্ব কম্পিউটেড প্রপার্টির অগ্রাধিকার থাকবে। - **ব্যবহার** @@ -558,7 +558,7 @@ Vue থেকে রানটাইম সতর্কতার জন্য এ ## app.config.optionMergeStrategies {#app-config-optionmergestrategies} -কাস্টম উপাদান বিকল্পগুলির জন্য মার্জিং কৌশল নির্ধারণের জন্য একটি বস্তু। +কাস্টম উপাদান বিকল্পগুলির জন্য মার্জিং কৌশল নির্ধারণের জন্য একটি অবজেক্ট। - **প্রকার** diff --git a/src/api/built-in-components.md b/src/api/built-in-components.md index c6aae743..ea455ed5 100644 --- a/src/api/built-in-components.md +++ b/src/api/built-in-components.md @@ -158,9 +158,9 @@ h(Transition, { ডিফল্টরূপে, `` একটি মোড়ক DOM উপাদান রেন্ডার করে না, তবে একটিকে `ট্যাগ` প্রপের মাধ্যমে সংজ্ঞায়িত করা যেতে পারে। - মনে রাখবেন যে অ্যানিমেশনগুলি সঠিকভাবে কাজ করার জন্য একটি ``-এর প্রতিটি শিশুকে অবশ্যই [**অনন্যভাবে কীযুক্ত**](/guide/essentials/list#maintaining-state-with-key) থাকতে হবে। + মনে রাখবেন যে অ্যানিমেশনগুলি সঠিকভাবে কাজ করার জন্য একটি ``-এর প্রতিটি চাইল্ডকে অবশ্যই [**অনন্যভাবে কীযুক্ত**](/guide/essentials/list#maintaining-state-with-key) থাকতে হবে। - `` CSS ট্রান্সফর্মের মাধ্যমে মুভিং ট্রানজিশন সমর্থন করে। একটি আপডেটের পরে যখন স্ক্রিনে একটি শিশুর অবস্থান পরিবর্তিত হয়, তখন এটি একটি চলমান CSS ক্লাস প্রয়োগ করা হবে (`name` বৈশিষ্ট্য থেকে স্বয়ংক্রিয়ভাবে তৈরি বা `move-class` প্রপের সাথে কনফিগার করা)। চলন্ত শ্রেণী প্রয়োগ করার সময় যদি CSS `transform` প্রপার্টি "transition-able" হয়, তাহলে উপাদানটি ব্যবহার করে তার গন্তব্যে মসৃণভাবে অ্যানিমেটেড হবে [FLIP technique](https://aerotwist.com/blog/flip-your-animations/)। + `` CSS ট্রান্সফর্মের মাধ্যমে মুভিং ট্রানজিশন সমর্থন করে। একটি আপডেটের পরে যখন স্ক্রিনে একটি চাইল্ডর অবস্থান পরিবর্তিত হয়, তখন এটি একটি চলমান CSS ক্লাস প্রয়োগ করা হবে (`name` বৈশিষ্ট্য থেকে স্বয়ংক্রিয়ভাবে তৈরি বা `move-class` প্রপের সাথে কনফিগার করা)। চলন্ত শ্রেণী প্রয়োগ করার সময় যদি CSS `transform` প্রপার্টি "transition-able" হয়, তাহলে উপাদানটি ব্যবহার করে তার গন্তব্যে মসৃণভাবে অ্যানিমেটেড হবে [FLIP technique](https://aerotwist.com/blog/flip-your-animations/)। - **উদাহরণ** @@ -269,7 +269,7 @@ h(Transition, { ## `` {#teleport} -এর স্লট বিষয়বস্তু DOM এর অন্য অংশে রেন্ডার করে। +এর স্লট বিষয়অবজেক্ট DOM এর অন্য অংশে রেন্ডার করে। - **Props** @@ -329,7 +329,7 @@ h(Transition, { - **বিস্তারিত** - `` দুটি স্লট গ্রহণ করে: `#default` slot এবং `#fallback` slot। এটি মেমরিতে ডিফল্ট slot রেন্ডার করার সময় ফলব্যাক স্লটের বিষয়বস্তু প্রদর্শন করবে। + `` দুটি স্লট গ্রহণ করে: `#default` slot এবং `#fallback` slot। এটি মেমরিতে ডিফল্ট slot রেন্ডার করার সময় ফলব্যাক স্লটের বিষয়অবজেক্ট প্রদর্শন করবে। ডিফল্ট স্লট রেন্ডার করার সময় যদি এটি async নির্ভরতা ([Async Components](/guide/components/async) এবং [`async setup()`](/guide/built-ins/suspense#async-setup)) সহ উপাদানগুলির সম্মুখীন হয়, ডিফল্ট slot প্রদর্শন করার আগে তাদের সব সমাধান না হওয়া পর্যন্ত এটি অপেক্ষা করবে। diff --git a/src/api/built-in-directives.md b/src/api/built-in-directives.md index df34d138..f86aaee4 100644 --- a/src/api/built-in-directives.md +++ b/src/api/built-in-directives.md @@ -2,7 +2,7 @@ ## v-text {#v-text} -উপাদানটির পাঠ্য বিষয়বস্তু আপডেট করুন। +উপাদানটির পাঠ্য বিষয়অবজেক্ট আপডেট করুন। - **Expects:** `string` @@ -28,13 +28,13 @@ - **বিস্তারিত** - `v-html` এর বিষয়বস্তু প্লেইন HTML হিসাবে ঢোকানো হয়েছে - Vue টেমপ্লেট সিনট্যাক্স প্রক্রিয়া করা হবে না। আপনি যদি নিজেকে `v-html` ব্যবহার করে টেমপ্লেট রচনা করার চেষ্টা করেন, তবে পরিবর্তে উপাদানগুলি ব্যবহার করে সমাধানটি পুনর্বিবেচনা করার চেষ্টা করুন। + `v-html` এর বিষয়অবজেক্ট প্লেইন HTML হিসাবে ঢোকানো হয়েছে - Vue টেমপ্লেট সিনট্যাক্স প্রক্রিয়া করা হবে না। আপনি যদি নিজেকে `v-html` ব্যবহার করে টেমপ্লেট রচনা করার চেষ্টা করেন, তবে পরিবর্তে উপাদানগুলি ব্যবহার করে সমাধানটি পুনর্বিবেচনা করার চেষ্টা করুন। ::: warning নিরাপত্তা নোট গতিশীলভাবে আপনার ওয়েবসাইটে নির্বিচারে HTML রেন্ডার করা খুব বিপজ্জনক হতে পারে কারণ এটি সহজেই [XSS আক্রমণ](https://en.wikipedia.org/wiki/Cross-site_scripting) হতে পারে। শুধুমাত্র বিশ্বস্ত কন্টেন্টে `v-html` ব্যবহার করুন এবং ব্যবহারকারীর দেওয়া কন্টেন্টে **কখনই না** ব্যবহার করুন। ::: - [Single-File Components](/guide/scaling-up/sfc), `v-html`-এর ভিতরের সামগ্রীতে `scoped` শৈলী প্রযোজ্য হবে না, কারণ সেই HTML Vue-এর টেমপ্লেট কম্পাইলার দ্বারা প্রক্রিয়া করা হয় না। আপনি যদি স্কোপড CSS দিয়ে `v-html` কন্টেন্ট টার্গেট করতে চান, তাহলে আপনি [CSS মডিউল](./sfc-css-features#css-modules) অথবা ম্যানুয়াল সহ একটি অতিরিক্ত, গ্লোবাল ` @@ -149,9 +149,9 @@ Vue টেমপ্লেটগুলি জাভাস্ক্রিপ্ট ### JavaScript Injection {#javascript-injection} -Vue এর সাথে ` ``` -আমরা ` ``` -পরিশেষে, আপনি প্রদত্ত মানটিকে [`readonly()`](/api/reactivity-core#readonly) দিয়ে মুড়ে দিতে পারেন যদি আপনি নিশ্চিত করতে চান যে `provide`-এর মাধ্যমে পাস করা ডেটা ইনজেক্টর উপাদান দ্বারা পরিবর্তিত হতে পারে না। +পরিশেষে, আপনি প্রদত্ত মানটিকে [`readonly()`](/api/reactivity-core#readonly) দিয়ে মুড়ে দিতে পারেন যদি আপনি নিশ্চিত করতে চান যে `provide`-এর মাধ্যমে পাস করা ডেটা ইনজেক্টর কম্পোনেন্ট দ্বারা পরিবর্তিত হতে পারে না। ```vue ``` -যখন একজন অভিভাবক টেমপ্লেট রেফের মাধ্যমে এই উপাদানটির একটি দৃষ্টান্ত পান, তখন পুনরুদ্ধারকৃত দৃষ্টান্তটি `{ a: number , b: number }` আকারের হবে (রেফগুলি স্বয়ংক্রিয়ভাবে স্বাভাবিক উদাহরণের মতোই খুলে ফেলা হয়)। +যখন একজন অভিভাবক টেমপ্লেট রেফের মাধ্যমে এই কম্পোনেন্টটির একটি দৃষ্টান্ত পান, তখন পুনরুদ্ধারকৃত দৃষ্টান্তটি `{ a: number , b: number }` আকারের হবে (রেফগুলি স্বয়ংক্রিয়ভাবে স্বাভাবিক উদাহরণের মতোই খুলে ফেলা হয়)। আরো দেখুন: [Typing Component Template Refs](/guide/typescript/composition-api#typing-component-template-refs) @@ -264,6 +264,6 @@ export default { } ``` -উপরের উদাহরণে, টেমপ্লেট রেফের মাধ্যমে এই উপাদানটি উল্লেখ করা একজন অভিভাবক শুধুমাত্র `publicData` এবং `publicMethod` অ্যাক্সেস করতে সক্ষম হবেন। +উপরের উদাহরণে, টেমপ্লেট রেফের মাধ্যমে এই কম্পোনেন্টটি উল্লেখ করা একজন অভিভাবক শুধুমাত্র `publicData` এবং `publicMethod` অ্যাক্সেস করতে সক্ষম হবেন। diff --git a/src/guide/essentials/template-syntax.md b/src/guide/essentials/template-syntax.md index 7022cac4..1b08b0ab 100644 --- a/src/guide/essentials/template-syntax.md +++ b/src/guide/essentials/template-syntax.md @@ -1,8 +1,8 @@ # Template Syntax {#template-syntax} -Vue একটি HTML-ভিত্তিক টেমপ্লেট সিনট্যাক্স ব্যবহার করে যা আপনাকে রেন্ডার করা DOM-কে অন্তর্নিহিত কম্পোনেন্ট ইনস্ট্যান্সের ডেটাতে ঘোষণামূলকভাবে আবদ্ধ করতে দেয়। সমস্ত Vue টেমপ্লেটগুলি সিনট্যাক্টিক্যালি বৈধ HTML যা বিশেষ-অনুসরণকারী ব্রাউজার এবং এইচটিএমএল পার্সার দ্বারা পার্স করা যেতে পারে। +Vue একটি HTML-ভিত্তিক টেমপ্লেট সিনট্যাক্স ব্যবহার করে যা আপনাকে রেন্ডার করা DOM-কে অন্তর্নিহিত কম্পোনেন্ট ইনস্ট্যান্সের ডেটাতে ডিক্লেয়ারভাবে আবদ্ধ করতে দেয়। সমস্ত Vue টেমপ্লেটগুলি সিনট্যাক্টিক্যালি বৈধ HTML যা বিশেষ-অনুসরণকারী ব্রাউজার এবং এইচটিএমএল পার্সার দ্বারা পার্স করা যেতে পারে। -হুডের নিচে, Vue টেমপ্লেটগুলিকে উচ্চ-অপ্টিমাইজ করা জাভাস্ক্রিপ্ট কোডে কম্পাইল করে। রিঅ্যাকটিভিটি সিস্টেমের সাথে একত্রিত হয়ে, Vue বুদ্ধিমত্তার সাথে পুনরায় রেন্ডার করার জন্য ন্যূনতম সংখ্যক উপাদান বের করতে পারে এবং অ্যাপের অবস্থা পরিবর্তন হলে ন্যূনতম পরিমাণ DOM ম্যানিপুলেশন প্রয়োগ করতে পারে। +হুডের নিচে, Vue টেমপ্লেটগুলিকে উচ্চ-অপ্টিমাইজ করা জাভাস্ক্রিপ্ট কোডে কম্পাইল করে। রিঅ্যাকটিভিটি সিস্টেমের সাথে একত্রিত হয়ে, Vue বুদ্ধিমত্তার সাথে পুনরায় রেন্ডার করার জন্য ন্যূনতম সংখ্যক কম্পোনেন্ট বের করতে পারে এবং অ্যাপের অবস্থা পরিবর্তন হলে ন্যূনতম পরিমাণ DOM ম্যানিপুলেশন প্রয়োগ করতে পারে। আপনি যদি ভার্চুয়াল DOM ধারণার সাথে পরিচিত হন এবং জাভাস্ক্রিপ্টের কাঁচা শক্তি পছন্দ করেন তবে আপনি ঐচ্ছিক JSX সমর্থন সহ টেমপ্লেটের পরিবর্তে [সরাসরি রেন্ডার ফাংশন লিখতে পারেন](/guide/extras/render-function)। যাইহোক, মনে রাখবেন যে তারা টেমপ্লেটের মতো একই স্তরের কম্পাইল-টাইম অপ্টিমাইজেশন উপভোগ করে না। @@ -34,9 +34,9 @@ mustaches ট্যাগটি `msg` প্রপার্টির মান

Using v-html directive:

-এখানে আমরা নতুন কিছু সম্মুখীন করছি. আপনি যে `v-html` অ্যাট্রিবিউটটি দেখছেন তাকে **নির্দেশ** বলা হয়। নির্দেশিকাগুলিকে `v-` এর সাথে উপসর্গযুক্ত করা হয় তা নির্দেশ করার জন্য যে সেগুলি Vue দ্বারা প্রদত্ত বিশেষ গুণাবলী, এবং আপনি যেমন অনুমান করেছেন, সেগুলি রেন্ডার করা DOM-এ বিশেষ প্রতিক্রিয়াশীল আচরণ প্রয়োগ করে৷ এখানে, আমরা মূলত বলছি "বর্তমান সক্রিয় উদাহরণে `rawHtml` বৈশিষ্ট্যের সাথে এই উপাদানটির অভ্যন্তরীণ HTML আপ-টু-ডেট রাখুন।" +এখানে আমরা নতুন কিছু সম্মুখীন করছি. আপনি যে `v-html` অ্যাট্রিবিউটটি দেখছেন তাকে **নির্দেশ** বলা হয়। নির্দেশিকাগুলিকে `v-` এর সাথে উপসর্গযুক্ত করা হয় তা নির্দেশ করার জন্য যে সেগুলি Vue দ্বারা প্রদত্ত বিশেষ গুণাবলী, এবং আপনি যেমন অনুমান করেছেন, সেগুলি রেন্ডার করা DOM-এ বিশেষ প্রতিক্রিয়াশীল আচরণ প্রয়োগ করে৷ এখানে, আমরা মূলত বলছি "বর্তমান সক্রিয় উদাহরণে `rawHtml` বৈশিষ্ট্যের সাথে এই কম্পোনেন্টটির অভ্যন্তরীণ HTML আপ-টু-ডেট রাখুন।" -`span` এর বিষয়বস্তু `rawHtml` বৈশিষ্ট্যের মান দিয়ে প্রতিস্থাপিত হবে, যাকে সাধারণ HTML হিসাবে ব্যাখ্যা করা হবে - ডেটা বাইন্ডিং উপেক্ষা করা হয়। মনে রাখবেন যে আপনি টেমপ্লেট আংশিক রচনা করতে `v-html` ব্যবহার করতে পারবেন না, কারণ Vue একটি স্ট্রিং-ভিত্তিক টেমপ্লেটিং ইঞ্জিন নয়। পরিবর্তে, উপাদানগুলিকে UI পুনঃব্যবহার এবং রচনার জন্য মৌলিক একক হিসাবে পছন্দ করা হয়। +`span` এর বিষয়অবজেক্ট `rawHtml` বৈশিষ্ট্যের মান দিয়ে প্রতিস্থাপিত হবে, যাকে সাধারণ HTML হিসাবে ব্যাখ্যা করা হবে - ডেটা বাইন্ডিং উপেক্ষা করা হয়। মনে রাখবেন যে আপনি টেমপ্লেট আংশিক রচনা করতে `v-html` ব্যবহার করতে পারবেন না, কারণ Vue একটি স্ট্রিং-ভিত্তিক টেমপ্লেটিং ইঞ্জিন নয়। পরিবর্তে, কম্পোনেন্টগুলিকে UI পুনঃব্যবহার এবং রচনার জন্য মৌলিক একক হিসাবে পছন্দ করা হয়। :::warning নিরাপত্তা সতর্কতা গতিশীলভাবে আপনার ওয়েবসাইটে নির্বিচারে HTML রেন্ডার করা খুব বিপজ্জনক হতে পারে কারণ এটি সহজেই [XSS দুর্বলতা](https://en.wikipedia.org/wiki/Cross-site_scripting) হতে পারে। শুধুমাত্র বিশ্বস্ত কন্টেন্টে `v-html` ব্যবহার করুন এবং ব্যবহারকারীর দেওয়া কন্টেন্টে **কখনই না** ব্যবহার করুন। @@ -50,7 +50,7 @@ HTML বৈশিষ্ট্যের মধ্যে Mustaches ব্যবহ
``` -`v-bind` নির্দেশিকা Vue-কে উপাদানের `id` বৈশিষ্ট্যকে উপাদানের `dynamicId` বৈশিষ্ট্যের সাথে সিঙ্কে রাখার নির্দেশ দেয়। যদি আবদ্ধ মান `null` বা `undefined` হয়, তাহলে বৈশিষ্ট্যটি রেন্ডার করা উপাদান থেকে সরানো হবে। +`v-bind` নির্দেশিকা Vue-কে কম্পোনেন্টের `id` বৈশিষ্ট্যকে কম্পোনেন্টের `dynamicId` বৈশিষ্ট্যের সাথে সিঙ্কে রাখার নির্দেশ দেয়। যদি আবদ্ধ মান `null` বা `undefined` হয়, তাহলে বৈশিষ্ট্যটি রেন্ডার করা কম্পোনেন্ট থেকে সরানো হবে। ### Shorthand {#shorthand} @@ -66,7 +66,7 @@ HTML বৈশিষ্ট্যের মধ্যে Mustaches ব্যবহ ### Boolean Attributes {#boolean-attributes} -[Boolean attributes](https://html.spec.whatwg.org/multipage/common-microsyntaxes.html#boolean-attributes) এমন বৈশিষ্ট্য যা একটি উপাদানে তাদের উপস্থিতি দ্বারা সত্য / মিথ্যা মান নির্দেশ করতে পারে। উদাহরণ স্বরূপ, [`disabled`](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/disabled) সর্বাধিক ব্যবহৃত বুলিয়ান বৈশিষ্ট্যগুলির মধ্যে একটি। +[Boolean attributes](https://html.spec.whatwg.org/multipage/common-microsyntaxes.html#boolean-attributes) এমন বৈশিষ্ট্য যা একটি কম্পোনেন্টে তাদের উপস্থিতি দ্বারা সত্য / মিথ্যা মান নির্দেশ করতে পারে। উদাহরণ স্বরূপ, [`disabled`](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/disabled) সর্বাধিক ব্যবহৃত বুলিয়ান বৈশিষ্ট্যগুলির মধ্যে একটি। `v-bind` এই ক্ষেত্রে একটু ভিন্নভাবে কাজ করে: @@ -105,7 +105,7 @@ data() { -আপনি একটি যুক্তি ছাড়াই `v-bind` ব্যবহার করে একটি একক উপাদানের সাথে আবদ্ধ করতে পারেন: +আপনি একটি যুক্তি ছাড়াই `v-bind` ব্যবহার করে একটি একক কম্পোনেন্টের সাথে আবদ্ধ করতে পারেন: ```vue-html
@@ -113,7 +113,7 @@ data() { ## Using JavaScript Expressions {#using-javascript-expressions} -এখন পর্যন্ত আমরা আমাদের টেমপ্লেটগুলিতে কেবলমাত্র সাধারণ সম্পত্তি কীগুলির সাথে আবদ্ধ হয়েছি। কিন্তু Vue আসলে সমস্ত ডেটা বাইন্ডিংয়ের ভিতরে জাভাস্ক্রিপ্ট এক্সপ্রেশনের সম্পূর্ণ শক্তি সমর্থন করে: +এখন পর্যন্ত আমরা আমাদের টেমপ্লেটগুলিতে কেবলমাত্র সাধারণ কম্পিউটেড প্রপার্টি কীগুলির সাথে আবদ্ধ হয়েছি। কিন্তু Vue আসলে সমস্ত ডেটা বাইন্ডিংয়ের ভিতরে জাভাস্ক্রিপ্ট এক্সপ্রেশনের সম্পূর্ণ শক্তি সমর্থন করে: ```vue-html {{ number + 1 }} @@ -148,7 +148,7 @@ Vue টেমপ্লেটগুলিতে, JavaScript এক্সপ্র ### Calling Functions {#calling-functions} -একটি বাইন্ডিং এক্সপ্রেশনের ভিতরে একটি উপাদান-উন্মুক্ত পদ্ধতি কল করা সম্ভব: +একটি বাইন্ডিং এক্সপ্রেশনের ভিতরে একটি কম্পোনেন্ট-উন্মুক্ত পদ্ধতি কল করা সম্ভব: ```vue-html