CSS পুনরায় তৈরি না করেই একটি ডিজাইন সিস্টেম তৈরি করা
ডিজাইন সিস্টেমগুলো প্রায়শই একটি ফাঁদে পড়ে যায়।
আপনি ইউটিলিটি ক্লাস যোগ করার মাধ্যমে শুরু করেন। আপনি রেসপনসিভ অপশন যোগ করেন। আপনি লেআউট হেল্পার যোগ করেন। শীঘ্রই, আপনি একটি নতুন সিনট্যাক্স তৈরি করে ফেলেন। শেষ পর্যন্ত আপনি ঠিক সেটাই করতে থাকেন যা CSS ইতিমধ্যে করে থাকে।
CSS-কে প্রতিস্থাপন করার চেষ্টা করা বন্ধ করুন।
পরিবর্তে, CSS-এর উপরে একটি লেয়ার তৈরি করুন। উদ্দেশ্যের (intent) ওপর গুরুত্ব দিন।
ডেভেলপাররা নমনীয়তা (flexibility) চান। কিন্তু নমনীয়তা জটিলতা নিয়ে আসে। অনেক সিস্টেম প্রতিটি ব্রেকপয়েন্ট এবং লেআউট অপশন উন্মুক্ত করে দেয়। এটি মার্কআপ পড়া কঠিন করে তোলে। আপনার কোড লেআউটটি কী কাজ করে তার চেয়ে লেআউটটি কীভাবে তৈরি করতে হবে তা বর্ণনা করতেই বেশি সময় ব্যয় করে।
সিস্টেমটি বোঝা কঠিন হয়ে পড়ে কারণ এটি সবকিছু বর্ণনা করার চেষ্টা করে।
আপনার ফোকাস পরিবর্তন করুন। একটি লেআউট কীভাবে তৈরি করা হয় সে সম্পর্কে কম ভাবুন। লেআউটটি কী অর্জন করে সে সম্পর্কে বেশি ভাবুন।
এই উদাহরণটি দেখুন:
এটি CSS-কে প্রতিস্থাপন করে না। এটি উদ্দেশ্য প্রকাশ করে।
- কন্টেন্টটি একটি গ্রিডের সাথে মানিয়ে নেয়।
- মোবাইলে, এটি স্ট্যাক (stack) হয়।
ইমপ্লিমেন্টেশন সিস্টেমের ভেতরেই থাকে। এটি আরও বেশি অ্যাবস্ট্রাকশন (abstraction) সম্পর্কে নয়। এটি আরও উন্নত যোগাযোগের (communication) বিষয়।
অবিরাম কনফিগারেশনের চেয়ে ভালো ডিফল্ট (defaults) অনেক বেশি কার্যকর। বেশিরভাগ লেআউট সাধারণ প্যাটার্ন অনুসরণ করে। বেশিরভাগ ডেভেলপার কন্টেন্ট সাজাতে চান, নতুন লেআউট সিস্টেম আবিষ্কার করতে চান না।
একটি ডিজাইন সিস্টেমের উচিত চিন্তাশীল ডিফল্ট প্রদান করা। আপনি যদি প্রতিটি CSS সক্ষমতা উন্মুক্ত করার চেষ্টা করেন, তবে আপনি হেরে যাবেন। CSS ইতিমধ্যে শক্তিশালী এবং মানসম্মত।
একটি ডিজাইন সিস্টেমের কাজ হলো:
- কগনিটিভ লোড (cognitive load) কমানো।
- সামঞ্জস্যতা (consistency) তৈরি করা।
- উদ্দেশ্য প্রকাশ করা।
- সাধারণ প্যাটার্নগুলোকে সহজ করা।
API ডিজাইন করার সময় নিজেকে এই প্রশ্নটি করুন: "আমি কি ছয় মাস পর এটি বুঝতে পারব?"
এই প্রশ্নগুলো করবেন না:
- "আমি কি সবকিছু কনফিগার করতে পারব?"
- "আমি কি প্রতিটি এজ কেস (edge case) সাপোর্ট করতে পারব?"
পঠনযোগ্যতা (readability) স্কেল করতে পারে। জটিলতা পারে না।
সরলতা কোনো সীমাবদ্ধতা নয়। লক্ষ্য হলো ক্ষমতাকে সঠিক স্থানে রাখা। সাধারণ ওয়ার্কফ্লোগুলো সহজ থাকা উচিত। উন্নত ওয়ার্কফ্লোগুলো অবশ্যই সম্ভব হতে হবে।
সেরা ডিজাইন সিস্টেমগুলো একটি সাধারণ ভাষা তৈরি করে। তারা ইমপ্লিমেন্টেশনের পরিবর্তে উদ্দেশ্যের ওপর গুরুত্ব দেয়। তারা ডেভেলপারদের উদ্দেশ্য প্রকাশ করতে সাহায্য করে।
ডেভেলপাররা লেআউট তৈরি করতে চান না। তারা প্রোডাক্ট তৈরি করতে চান। লেআউট কাজের একটি অংশ মাত্র।
উৎস: https://dev.to/stinklewinks/building-a-design-system-without-recreating-css-1a41