Aliasghar Mirshahi
2 سال پیش توسط Aliasghar Mirshahi مطرح شد
2 پاسخ

راهنمای در اضافه کردن react به پروژه django

سلام دوستان من به تازگی با جنگو کار میکنم و خیلی به مباحث وب آشنا نیستم
یه موردی پیش اومده من یکی از دوستانم یه پروژه اپ آب و هوا با React داره و من بک اند اونو با جنگو زدم و میخوایم متصل کنیم و من به ریکت آشنا نیستم که به صورت دستی خودم تگ های جنگو رو داخلش بزارم چندجا تحقیق کردم و گفتن از api استفاده کن ولی اصلا درک درستی ازش ندارم ممنون میشم اگر مقاله ای یا اموزش خوبی سراغ دارید معرفی کنید یا روش دیگری باشه که نیاز نباشه فعلا از api استفاده کنم


ثبت پرسش جدید
حسین
@eshhp2101 2 سال پیش آپدیت شد
2

سلام
کلا ری اکت واسه ساخت وب اپلیکیشن های تک صفحه ای به کار میره و توی خروجی کار ری اکت هم نهایتا یه فایل html بیشتر ندارین و اگه از react router dom استفاده کرده باشه تمام مسیر ها داخل خود اپ ری اکت هستن و راهی برای برقراری ارتباط بین اپ ری اکت و جنگو جز api ندارین
api هم چیز زیاد عجیبی نیست، فقط یه راهه که دو تا اپلیکیشن اطلاعات رو بین همدیگه رد و بدل کنن، که اینجا ما میخوایم بین اپلیکشن سمت کاربر که با ری اکته و اپلیکیشن سمت سرور که با جنگو هست ( اصلا مهم نیست با چه زبان یا فریمورکی باشه، حتی میتونه با php یا golang باشه! ) این اطلاعات رو رد و بدل کنیم
برای مثال توی اپ جنگو توی url هام یه path به اسم

"/apis/get-weather" 

بزارم که اطلاعات آب و هوایی یه شهری که اسم شهر توی بدنه درخواست http اومده رو بدم
اگه متد درخواست get بود که پارامتر ها توی خود url هستن ولی اگه post یا چیز دیگه ای بود توی بدنه درخواست هستن که توی جنگو با

request.body

میتونین به بدنه درخواست دسترسی داشته باشین و این اطلاعات با یه فرمت های خاصی هستن که اون مربوط به نحوه ارسال توسط کسی که فرانت رو میزنه داره، ولی فرم استانداردش xWwwUrlEncoded هستش و ماژول های استانداردی واسه دیکد کردن اون وجود داره توی پایتون، توی خود جنگو هم اگه متد post باشه اون رو با

request.POST

میتونین به دست بیارین، حتی میتونین خودتون یه الگوریتم بنویسین که اون رو دیکد کنه.
یه فرمت دیگه هم هست که اون بیشتر برای رد و بدل فایل و عکس های باینری به کار میره به اسم formData که دنگ و فنگ خیلی داره و فک نکنم که نیاز بشه، اگه هم نیاز شد سرچ کنین راه حل هایی وجود داره.

میتونین اطلاعات رو با استفاده از فرمت json رد و بدل کنید که توی خود جنگو یه کلاس jsonResponse وجود داره مثل htppresponse که یه رشته بهش میدین و اون رو در پاسخ میده یا تابع render که یه فایل html رو رندر میکنه و در پاسخ میده، توی jsonResponse هم یه دیکشنری یا لیست میگره و اون رو به فرمت json در میاره و در پاسخ میده و میتونین توی ویو هاتون از اون استفاده کنین
برای مثال همون path که بالا بود رو به این ویو وصل میکنیم

def get_weather(request): 
   city = c # اسم شهر رو باید از درخواست بخونین
   data ={
        "Saturday": "sunny"
        "Sunday": "cloudy"
        # و الی آخر... 
    } 
    res = jsonResponse(data) 
    return res

و اگه یه درخواست به apis/get-weather بدم همچین جوابی بهم میده

GET http://domain.com/apis/get-weather?city=tehran
response body:
{
    "Saturday": "sunny"
    "Sunday": "cloudy"
}

و توی جاوا اسکریپت با متد parse کلاس JSON میشه این ها رو به اشیاء جاوااسکریپت تبدل کرد

JSON.parse(response)
// returns {
//    Saturday: "sunny"
//    Sunday: "cloudy"
// } 

این یه مثاله و در واقعیت خیلی با اون چیزی که میخواین فرق میکنه ولی شکل کلی همینه که با درخواست های http، اپ ری اکت دیتای خام رو از سمت سرور میگیره و اون رو استفاده میکنه.
در نهایت اپ ری اکت یه فایل html و چند تا فایل js و css هست که باید هر درخواست به هر مسیری باشه(به جز ای پی آی ها و فایل های استاتیک مثل جاوا اسکریپت و سی اس اس) باید اون فایل html اصلی رو به عنوان پاسخ بدین(ممکنه هم اینجوری نباشه و برنامه نویسی که فرانت رو نوشته هر صفحه رو جدا یه اپ براش ساخته باشه، در کل باید بین خودتون و کسی که فرانت رو مینویسه هماهنگ کنین)
امیدوارم گیج نشده باشین (خودم که نوشتم گیج شدم چه برسه به کسی که میخونه 😑)
اگه هم شدین مشکلی نیست با سرچ کردن توی گوگل میتونین مشکلاتی که دارین رو برطرف کنین، افراد دیگه ای هم همین مشکلات رو داشتن و میتونین سوال و جواب هاشون رو توی Stackoverflow ببینین
در نهایت امیدوارم موفق باشین

میتونین اسناد مربوط به jsonRespone رو اینجا ببینین


Aliasghar Mirshahi
تخصص : junior python developer
@lmyrshahy3 2 سال پیش مطرح شد
0

@eshhp2101 دمت گرم وقت گذاشتی و جامعه توضیح دادی واقعا ممنون بخش زیادی از مشکلم حل شد بقیه هم با سرچ یه جوری سرهمش میکنم چون پروژه اول و تازه کارم فقط کار گنه بسه فعلا البته حالا بریم جلوتر ببینم چی میشه


برای ارسال پاسخ لازم است وارد شده یا ثبت‌نام کنید

ورود یا ثبت‌نام