می توانید از tailwind استفاده کنید پس در ابتدا یک پروژه خام ایجاد کنید.
قرار است یک فرمی داشته باشیم که تنها یک اینپوت دارد که متنی از کاربر میگیرد و دکمه ای دارد که این متن را به لیستی که خود یک state هست اضافه می نماید که این موارد داخل کامپوننت Form.jsx می باشند.
این لیست در کامپوننت List.jsx نمایش داده می شود.
یک کامپوننت که دارای ۲ کامپوننت دیگر است
-
FarawinInput
-
button
که در اصل فرمی است که یک متن از کاربر می گیرد و با زدن دکمه متن را به لیستی اضافه می نماید.
کامپوننتی که تنها یک input دارد و آن را به پدر خود پاس می دهد .
لیست مورد نظر را بدین صورت نمایش می دهد. جدولی که ستون اول ردیف ستون دوم متن وارد شده و ستون سوم دکمه ای برای حذف آن ردیف
حداقل کامپوننت ها باید مانند تصویر زیر باشد در صورت نیاز می توانید کامپوننت های دیگری بسازید
توجه کنید هر کامپوننت و قسمت باید در فایل جدایی باشد
- بر اساس سلیقه خود فرم و لیست را بسازید
- حتما ریسپانسیو بوده و بهتر است ابتدا برای سایز موبایل بسازید
- می توانید از tailwind یا css معمولی استفاده نمایید.
- نکات و جزئیات مهم را کامنت گذاری نمایید
- استفاده از Context در آزمون بهتر است
- از کدها و استیت ها و پراپ های اضافه خودداری کنید
- کارکرد صحیح و روان برنامه را براساس سلیقه خود پیش ببرید
