ارشد نرمافزار و توسعهدهنده React و Next.js🚀 | طراحی سایتهای مدرن و کاربرپسند | ارتباط با من zil.ink/seyedahmaddev
ساخت برنامه شجره نامه چه داده های ورودی میخواهد؟
ساخت یه برنامه شجرنامه با ریاکت یه کار جالبه که میتونه به شما کمک کنه تا تاریخچه خانوادگیتون رو سازماندهی و حفظ کنین. توی این راهنما، یه مرور کلی از مراحل اصلی و نوع ورودیهایی که میتونید استفاده کنین ارائه میدیم.
1. اطلاعات شجرنامه:
نام و نام خانوادگی: این اطلاعات برای شناسایی هر فرد ضروریه.
تاریخ تولد و فوت: این اطلاعات به شما کمک میکنه تا سن هر فرد رو حساب کنین و یه جدول زمانی بسازین.
جنسیت: برای نمایش درست آیکونها (مثل مرد یا زن) استفاده میشه.
رابطه: اینجاست که مشخص میکنین چه نسبتی با هم دارن (مثلا پدر، مادر، فرزند، همسر و غیره).
عکس: میتونین برای هر نفر عکس بذارین.
داستان: یه متن کوتاه درباره هر فرد بنویسین.
اطلاعات دیگه: محل تولد، شغل، تحصیلات و ... .
2. تنظیمات برنامه:
نوع شجرنامه: اجدادی، نوادگان یا خاندانی؟
طرحبندی: عمودی، افقی یا دایرهای؟
سبک: کلاسیک، مدرن یا مینیمالیستی؟
تنظیمات حریم خصوصی: چه کسی
میتونه ببینه و ویرایش کنه؟
3. ورودیهای کاربر:
اطلاعات جدید: افراد، روابط و عکسهای جدید اضافه کنین.
ویرایش اطلاعات: نام، تاریخ، جنسیت،
رابطه و داستان رو ویرایش کنین.
صدور: شجرنامه رو به PDF یا PNG تبدیل کنین.
انتخاب ورودیها:
به نیازها و سلیقتتون بستگی داره. یه شجرنامه ساده فقط به اسم، تاریخ و جنسیت نیاز داره. یه شجرنامه کاملتر میتونه عکس، داستان و اطلاعات دیگه هم داشته باشه.
https://m.youtube.com/watch?v=J2pBaVOOQwI
https://youtu.be/rUo_ADUkDWw?si=6piBOLjeVU5piB9s
React Family Tree library:
https://draghici.net/2024/01/31/family-tree-genealogy-application-with-react/
https://github.com/SanichKotikov/react-family-tree
https://codesandbox.io/examples/package/react-family-tree
https://balkan.app/FamilyTreeJS/Docs/React
این هم یک سایت درباره شجره نامه است، میتونید داده های بیشتری در اینباره پیدا کنید
www.ancestry.com
مطلبی دیگر از این انتشارات
جابجایی بین صفحات و ناوبری در ری اکت - Navigation In React
مطلبی دیگر از این انتشارات
۱۷ سوال مصاحبه ریاکت که هر توسعهدهندهای در سال ۱۴۰۴ باید بداند
مطلبی دیگر از این انتشارات
هوکهای ری اکت یا React Hooks