AI-Native ওয়েব ডেভেলপমেন্টের জন্য টেক-স্ট্যাক
Claude Code-এর মতো AI এজেন্টগুলো সফটওয়্যার তৈরির পদ্ধতি বদলে দিচ্ছে। আপনি আগের চেয়ে অনেক দ্রুত কাজ করতে পারবেন। কিন্তু এই গতি অগোছালো কোড তৈরির কারণ হতে পারে। প্রজেক্টের উন্নতির জন্য আপনাকে এটি সহজ এবং রক্ষণাবেক্ষণযোগ্য (maintainable) রাখতে হবে।
দ্রুত তৈরি করতে এবং সহজে স্কেল করতে আমরা যে স্ট্যাকটি ব্যবহার করি তা নিচে দেওয়া হলো।
AI এজেন্ট কৌশল অতিরিক্ত জটিলতা (overengineer) তৈরি করবেন না। AI হাজার হাজার লাইনের অপ্রয়োজনীয় কোড যোগ করা সহজ করে দেয়।
- আপনার AGENTS.md বা CLAUDE.md ফাইলগুলো ছোট রাখুন।
- শুধুমাত্র সেই প্রজেক্ট রুলসগুলো অন্তর্ভুক্ত করুন যা এজেন্টরা প্রায়ই ভুল করে।
- শুধুমাত্র প্রয়োজন হলেই নির্দিষ্ট স্কিলগুলো ইনস্টল করুন।
- কনটেক্সট পরিষ্কার রাখতে কথোপকথন শেষ হলে স্কিলগুলো সরিয়ে ফেলুন।
ফ্রন্টএন্ড এবং UI
- Next.js: App Router ব্যবহার করুন। এটি উন্নত SEO এবং গতির জন্য সার্ভার-সাইড রেন্ডারিং হ্যান্ডেল করে।
- React: দ্রুত ফিচার যোগ করার জন্য সেরা ইকোসিস্টেম।
- MUI (Material UI): Figma-তে সবকিছু শুরু থেকে ডিজাইন করার ঝামেলা এড়াতে আমরা এটি ব্যবহার করি। এটি মাসের পর মাস কাজ বাঁচিয়ে দেয়।
- Zod এবং React Hook Form: জটিল ফর্ম এবং ভ্যালিডেশন হ্যান্ডেল করার জন্য সেরা কম্বো।
ব্যাকএন্ড এবং ডেটা
- Firebase: আমরা অথেন্টিকেশন, স্টোরেজ এবং ডেটাবেসের (Firestore) জন্য এটি ব্যবহার করি।
- Firestore Rules: এটি একটি ফাইলের মাধ্যমেই সব পারমিশন হ্যান্ডেল করে। এর ফলে বারবার সিকিউরিটি কোড লেখার প্রয়োজন হয় না।
- Firebase Functions: জটিল লজিকের জন্য এগুলো ব্যবহার করুন। আপনার ফ্রন্টএন্ডকে সহজ (dumb) এবং ব্যাকএন্ডকে বুদ্ধিমান (smart) রাখুন।
- Vercel AI SDK: আপনার অ্যাপে বিভিন্ন AI মডেল ইন্টিগ্রেট করার সবচেয়ে সহজ উপায়।
টেস্টিং এবং ডিপ্লয়মেন্ট
- Integration Tests: ব্যাকএন্ড সার্ভিস লেয়ার টেস্ট করার জন্য আমরা Jest ব্যবহার করি। আমরা ছোট ছোট ইউনিট টেস্টের চেয়ে বিভিন্ন অংশ কীভাবে একসাথে কাজ করে তার ওপর বেশি গুরুত্ব দিই।
- TypeScript: নিরাপদ রিফ্যাক্টরিংয়ের (refactoring) জন্য এটি অপরিহার্য।
- Vercel: এটি GitHub-এর সাথে যুক্ত হয়ে তাৎক্ষণিক প্রোডাকশন এবং প্রিভিউ ডিপ্লয়মেন্ট প্রদান করে।
- PostHog: অ্যানালিটিক্স, সেশন রিপ্লে এবং এরর লগ-এর জন্য এটি ব্যবহার করুন।
- Resend এবং react-email: এটি আপনাকে React কম্পোনেন্ট হিসেবে ইমেল লিখতে সাহায্য করে।
এই স্ট্রাকচারসহ একটি টেমপ্লেট প্রজেক্ট GitHub-এ রয়েছে।
Source: https://dev.to/martinxpn/the-teach-stack-for-building-web-platforms-in-the-ai-native-era-45ka
Optional learning community: https://github.com/MartinXPN/nextjs-firebase-mui-starter