Styling এবং CSS

আমি কিভাবে কম্পোনেন্টের সাথে CSS ক্লাস যুক্ত করবো?

একটা string-কে className prop হিসেবে পাঠানঃ

render() {
  return <span className="menu navigation-menu">Menu</span>
}

কম্পোনেন্টের prop বা state এর ওপর CSS class নির্ভর করা স্বাভাবিকঃ

render() {
  let className = 'menu';
  if (this.props.isActive) {
    className += ' menu-active';
  }
  return <span className={className}>Menu</span>
}

পরামর্শ

যদি আপনি প্রায়ই এরকম কোড লিখে থাকেন, তাহলে classnames প্যাকেজ এটি সহজ করতে পারে।

আমি কি inline style ব্যবহার করতে পারি?

হ্যাঁ, styling এর ডকুমেন্টেশন এখানে দেখুন।

Inline styles কি খারাপ?

CSS class সাধারণত কর্মক্ষমতার দিক দিয়ে inline style এর থেকে ভালো।

CSS-in-JS কি?

“CSS-in-JS” বলতে এমন একটা প্যাটার্নকে বুঝায় যেখানে CSS-কে বাহিরের কোনো ফাইলে না লিখে JavaScript এর ভিতর লেখা করা হয়। CSS-in-JS লাইব্রেরিগুলোর পার্থক্য দেখুন এখানে

বিঃদ্রঃ এই ফিচারটি React এর অংশ নয়, বরং তৃতীয়-পক্ষের লাইব্রেরি এই ফিচারটি দিয়ে থাকে। কিভাবে স্টাইল লেখা উচিত সে সম্পর্কে React এর কোনো পরামর্শ নেই। যদি সিদ্ধান্তহীনতা থাকে, তাহলে আলাদা একটা *.css ফাইলে স্বাভাবিকভাবে স্টাইল লিখে className এর সাহায্যে তা ব্যবহার করার মাধ্যমে শুরু করতে পারেন।

আমি কি React এ অ্যানিমেশন করতে পারি?

এনিমেশনের জন্য React-কে ব্যবহার করা যেতে পারে। উদাহরণস্বরূপ, React Transition Group এবং React Motion অথবা React Spring দেখুন।