প্রকল্প সম্পর্কে
Vitesse হল Anthony Fu দ্বারা তৈরি Vite এবং Vue 3 ব্যবহার করে ওয়েব অ্যাপ্লিকেশন তৈরির জন্য একটি অত্যন্ত মতামত-ভিত্তিক স্টার্টার টেমপ্লেট। এর লক্ষ্য হল একটি দ্রুত, প্রি-কনফিগারড সেটআপ প্রদান করা যাতে ডেভেলপাররা কনফিগারেশনে সময় না দিয়ে দ্রুত ধারণাকে কার্যকর অ্যাপে রূপান্তর করতে পারে। টেমপ্লেটটি গতির জন্য ডিজাইন করা হয়েছে, pnpm, esbuild এবং Vite-এর মতো আধুনিক টুলিং ব্যবহার করে, এবং এতে অনেকগুলি ফিচার এবং প্লাগইন অন্তর্ভুক্ত রয়েছে।
**মূল বৈশিষ্ট্যসমূহ**
- **Vue 3 + Vite**: দ্রুত ডেভেলপমেন্ট এবং বিল্ড সময়ের জন্য Vite সহ সর্বশেষ Vue 3-এর উপর ভিত্তি করে।
- **ফাইল-ভিত্তিক রাউটিং**: `src/pages` ডিরেক্টরি থেকে স্বয়ংক্রিয় রুট তৈরি করতে `unplugin-vue-router` ব্যবহার করে।
- **অটো-ইমপোর্ট**: কম্পোনেন্ট, API (যেমন Composition API) এবং আইকন স্বয়ংক্রিয়ভাবে ইমপোর্ট হয়, যা বয়লারপ্লেট কমায়।
- **স্টেট ম্যানেজমেন্ট**: স্বজ্ঞাত, টাইপ-নিরাপদ স্টেট ম্যানেজমেন্টের জন্য Pinia।
- **লেআউট সিস্টেম**: `vite-plugin-vue-layouts` এর মাধ্যমে একাধিক লেআউট সাপোর্ট করে।
- **PWA সাপোর্ট**: প্রগ্রেসিভ ওয়েব অ্যাপ ক্ষমতার জন্য `vite-plugin-pwa` এর সাথে সংহত।
- **স্টাইলিং**: UnoCSS তাত্ক্ষণিক অন-ডিমান্ড অ্যাটমিক CSS-এর জন্য, Iconify এর মাধ্যমে যেকোনো আইকন সেট সাপোর্ট করে।
- **আন্তর্জাতিকীকরণ**: বহু-ভাষা সাপোর্টের জন্য `unplugin-vue-i18n` সহ Vue I18n।
- **মার্কডাউন**: Shiki সিনট্যাক্স হাইলাইটিং সহ `unplugin-vue-markdown` ব্যবহার করে মার্কডাউনকে Vue কম্পোনেন্ট হিসেবে লেখা।
- **SSG**: `vite-ssg` এর মাধ্যমে স্ট্যাটিক-সাইট জেনারেশন, `beasties` ব্যবহার করে ক্রিটিকাল CSS অপ্টিমাইজেশন সহ।
- **টেস্টিং**: ইউনিট টেস্টের জন্য Vitest এবং E2E টেস্টের জন্য Cypress, GitHub Actions-এর সাথে সংহত।
- **TypeScript**: সম্পূর্ণ TypeScript সাপোর্ট।
- **ডিপ্লয়মেন্ট**: Netlify-তে জিরো-কনফিগ ডিপ্লয়মেন্ট, পাশাপাশি প্রোডাকশন বিল্ডের জন্য Docker সাপোর্ট।
**প্রি-প্যাকড প্লাগইন**
- Vue Router, Pinia, VueUse, হেড ম্যানেজমেন্টের জন্য Unhead, এবং উন্নত ডেভেলপার অভিজ্ঞতার জন্য `vite-plugin-vue-devtools`।
- `@antfu/eslint-config` ব্যবহার করে ESLint দিয়ে কোডিং স্টাইল প্রয়োগ করা হয় (একক উদ্ধৃতি, সেমিকোলন নেই)।
- Vite, Volar, Iconify IntelliSense, i18n Ally এবং ESLint-এর জন্য VS Code এক্সটেনশন সুপারিশ করা হয়।
**ভ্যারিয়েশন**
টেমপ্লেটটি বেশ কয়েকটি কমিউনিটি-রক্ষণাবেক্ষণ করা ভ্যারিয়েশনকে অনুপ্রাণিত করেছে, যার মধ্যে রয়েছে:
- `vitesse-lite`: হালকা সংস্করণ।
- `vitesse-nuxt3`: Nuxt 3-এর জন্য।
- `vitesse-webext`: ব্রাউজার এক্সটেনশনের জন্য।
- `vitesse-ssr-template`: SSR সাপোর্ট সহ।
- `vitailse`: TailwindCSS সহ।
- `vitesse-h5`: মোবাইল অ্যাপের জন্য।
- `vitesse-solid`: SolidJS-এর জন্য।
**ব্যবহার**
- **ডেভেলপমেন্ট**: `pnpm dev` চালান এবং `http://localhost:3333` দেখুন।
- **বিল্ড**: `pnpm build` চালিয়ে একটি `dist` ফোল্ডার তৈরি করুন।
- **ডিপ্লয়**: রিপো সংযুক্ত করে Netlify-তে ডিপ্লয় করুন, অথবা `docker buildx build . -t vitesse:latest` দিয়ে Docker ব্যবহার করুন এবং `docker run --rm -it -p 8080:80 vitesse:latest` দিয়ে চালান।
**নোট**: লেখক নতুন প্রজেক্টের জন্য Nuxt ব্যবহারের পরামর্শ দেন কারণ ভালো Vue ডেভেলপার অভিজ্ঞতা এবং আরও ধারাবাহিক রক্ষণাবেক্ষণ, কারণ Vitesse প্রাথমিক Vite/Vue 3 ট্রানজিশন সময়কালের এবং আপডেট ধীর হতে পারে। তবে, এটি শেখার জন্য এবং এর মতামত-ভিত্তিক সেটআপের সাথে সামঞ্জস্যপূর্ণ প্রজেক্টের জন্য একটি শক্ত রেফারেন্স হিসেবে রয়ে গেছে।
**কাস্টমাইজেশনের জন্য চেকলিস্ট**
টেমপ্লেট ব্যবহার করার সময়, `LICENSE`-এ লেখকের নাম, `App.vue`-তে শিরোনাম, `vite.config.ts`-এ হোস্টনাম, `public`-এ ফেভিকন আপডেট করুন, `.github` ফোল্ডারটি সরান এবং README এবং রুটগুলি পরিষ্কার করুন।
সামগ্রিকভাবে, Vitesse হল ডেভেলপারদের জন্য একটি শক্তিশালী, ফিচার-সমৃদ্ধ স্টার্টার যারা Vue 3 অ্যাপের জন্য একটি ব্যাপক, মতামত-ভিত্তিক সেটআপ চান, গতি এবং ডেভেলপার অভিজ্ঞতার উপর ফোকাস সহ।
Comments
0 Rating appears after 10 ratings
Sign in to join the discussion.