آموزش ساخت سایت و برنامه نویسی با ChatGPT به زبان ساده

یکی از بزرگترین ادعاهایی که برای تبلیغات ChatGPT وجود دارد این است که می تواند یک ابزار برنامه نویسی موثر باشد. 👨‍💻 ایده به این شرح است که شما آنچه که می خواهید را به زبان طبیعی توصیف می کنید، چت بات کدی تولید می کند که دقیقا این کار را انجام می دهد. اما در واقع ChatGPT چقدر در انجام این کار خوب است؟ در آموزش ساخت سایت و برنامه نویسی با ChatGPT به زبان ساده امروز انزل وب ما در این باره اطلاعاتی را در اختیار شما قرار خواهیم داد.

آموزش برنامه نویسی با چت جی پی تی

How to Build a Web App With ChatGPT

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

چطور با ChatGPT برنامه نویسی کنیم؟

برای رسیدن به جواب سوال چطور با ChatGPT برنامه نویسی کنیم مراحل زیر را دنبال کنید، اگر در هر مرحله با خطایی مواجه شدید می توانید از مطلب آموزش کامل ۱۱ روش حل مشکل ارور های رایج در ChatGPT کمک بگیرید.

مرحله ۱: ایجاد طرح اولیه برای برنامه وب

درست مانند کاری که هنگام ساخت یک برنامه تحت وب با هر ابزار دیگری انجام می دهید، در اینجا باید طرح اولیه ای ایجاد کنید تا برنامه را شبیه آن بسازید. مراحل را کاملا ترسیم کنید. از ChatGPT بخواهید که پلنی برای بک برنامه چت ساده ایجاد کند. برای انجام این کار ما الزامات برنامه تحت وب خود را توضیح دادیم و سپس از چت بات خواستیم تا طرحی را برای توسعه برنامه به تفصیل ارائه دهد.

فلوچارت یا طرح اولیه ای که توسط ChatGPT ایجاد شد به صورت زیر است:

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

بدون افزونه یا پلاگین، یک طرح مبتنی بر متن یا یک فلوچارت ASCII-art را دریافت خواهید کرد. حتی بدون پلاگین، ChatGPT همچنان باید یک نقشه واضح از برنامه را به شما ارائه دهد.

مرحله ۲: تقسیم طرح به ماژول های کوچکتر

مرحله بعدی که برای ساخت سایت با چت جی پی تی باید انجام دهید این است که طرحی که در مرحله قبل بدست آورده اید را به ماژول های کوچکتر تبدیل کنید. از ChatGPT برای تقسیم برنامه به اجزای کوچکتر استفاده کردیم کردیم تا این بخش ها را به صورت جداگانه توسعه دهیم و بعد برای تشکیل برنامه وب با هم ادغام کردیم. برای طرح بالا، ChatGPT پیشنهاد می کند که آن را به سه کامپوننت تبدیل کنیم:

• ماژول ثبت نام
• ماژول ورود / لاگین
• ماژول چت

ساخت فرم ثبت نام با ChatGPT

ما از ChatGPT خواستیم تا الگوریتم مناسبی ایجاد کند، در اینجا خود ما مداخله کردیم و مشخص کردیم که برای ثبت نام فقط به نام کاربری، ایمیل و آواتار کاربر نیاز داریم.

که نتیجه به صورت زیر است:

در مرحله بعد ما از ChatGPT خواستیم تا کامپوننت ثبت نام را بسازد.

اگر چه ما فیلد رمز عبور را به عنوان بخشی از فرایند ثبت نام وارد نکردیم، ChatGPT با گنجاندن آن در کد HTML تولید شده، کار درستی را انجام داد. ما کد را بدون هیچ تغییری کپی کردیم و در اینجا نحوه اجرای آن در مرورگر را مشاهده می کنید.

در مرحله بعد از ChatGPT خواستیم تا اسکریپت ثبت نام PHP را تولید کند. در ابتدا از ما خواسته شد یک کد PHP برای سمت سرور و مدیریت ارسال فرم بنویسید. گرچه اسکریپت تولید شده به خوبی کار می کند اما آسیب پذیری های زیادی دارد.

هیچ هش رمز، مدیریت خطایی وجود ندارد و در مرز خطر حمله تزریق SQL است. ChatGPT فقط حداقل نیازها را برآورده می کند. رفع این مشکل نسبتا ساده است. ما از ChatGPT خواستیم نا همه موراد اشتباه را که در کد ایجاد کرده است را شناسایی کند و بعد از نقاط شناسایی شده برای بهینه سازی کد استفاده کند.

جمله بندی و بیان نیاز شما بسیار مهم است. شما باید آنچه که نیاز دارید را به صورت خیلی واضح و مشخص با ChatGPT در میان بگذارید. به طور مثال وقتی ما خیلی ساده از چت جی پی تی خواستیم که مشکل کد را رفع کند این کار را انجام نداد.

در مرحله بعد از ChatGPT خواستیم که یک کد SQL بنویسد تا یک پایگاه داده برای داده های گرفته شده از اسکریپت PHP ایجاد کند. در ادامه نتیجه کار را مشاهده خواهید کرد:

در ادامه اجرای جدول ایجاد شده را مشاهده می کنید:

با راه اندازی پایگاه داده، اولین ثبت نام خود را امتحان کردیم و بدون هیچ خطایی کد اجرا شد.

ساخت کامپوننت لاگین

مرحله بعدی ساخت وب اپ با ChatGPT ما در اینجا این است که از کامپوننت ثبت نام خارج شوید و کامپوننت لاگین را بسازیم. مانند مراحل بالا آنچه که نیاز داریم را به صورت واضح بیان می کنیم:

در ادامه صفحه لاگین ایجاد شده را مشاهده می کنید. نکته مهم این است که از تنوع رنگ مشابه صفحه ثبت نام استفاده می کند.

بعد از ایجاد فایل server.login.php طبق دستور ChatGPT و اضافه کردن اسکریپت PHP تولید شده اولین لاگین موفق خود را بدون هیچ گونه تغییر یا باگی انجام دادیم.

ساخت کامپوننت چت

ساخت کامپوننت چت آخرین و احتمالا سخت ترین بخش تست ما خواهد بود. در ابتدا، ما به سادگی از ChatGPT خواستیم تا کد کامپوننت چت را بنویسد. نیازی به گفتن نیست که شکست خوردیم. برای کامپوننت های پیچیده‌تری که می خواهید ایجاد کنید باید آن را به مولفه های کوچک تری تقسیم کنید.

ما از ChatGPT خواستیم تا پیشنهادی برای تقسیم کامپوننت به ما بدهد. چت جی پی تی به ما پیشنهاد ساخت سه صفحه زیر را داد:

• php
• Send-messages.php
• Fetch-messages.php

هنگامی که ChatGPT نام فایلی را پیشنهاد می کند، استفاده از نام دیگری در پروژه شما ممکن است به طور ناخواسته مشکلاتی ایجاد کند زیرا ربات چت در تمام کدهایی که در طول پروژه ایجاد می کند به همان نام اشاره می کند.

ایجاد صفحه Chat.php

برای شروع، به ChatGPT دستورالعمل‌های مفصلی در مورد اینکه می‌خواهیم رابط چت چگونه به نظر برسد، دادیم.

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

هر زمان که کد تولید شده نتواند نتایج دلخواه را بدهد یا یک کامپوننت مهم را حذف کند، به سادگی از ChatGPT بخواهید تا آخرین کد را بازنویسی کند. به چت جی پی تی بگویید کامپوننت را اضافه کند یا هر کاری که در کد اولیه انجام نشده است را انجام دهد. در اینجا چند نکته در مورد نحوه استفاده از ChatGPT برای برنامه نویسی آورده شده است .

ایجاد صفحه send-messages.php و  Fetch-messages

بعد از اینکه از نتیجه کار رابط راضی شدیم، اقدام به ساخت اسکریپت برای مدیریت چت کردیم. برای اینکه بتوانیم پیام ها را از پایگاه داده ارسال و واکشی کنیم، ChatGPT تاکید کرد که ما به جدول Messages نیاز خواهیم داشت. ما از ربات چت خواستیم یک SQL برای جدول Messages بسازید.

پس از تولید یک کد SQL، از ربات چت خواستیم تا یک اسکریپت PHP برای مدیریت پیام‌رسان ایجاد کند.

ChatGPT اسکریپت را برای هر دو صفحه “send-messages.php” و “fetch-messages.php” تولید کرد. در اجرای هر دو اسکریپت، در نهایت اولین خطای خود را داشتیم.

به نظر می رسد این خطا به دلیل معرفی ChatGPT برای یک متغیر جلسه اعلام نشده $_SESSION[‘user_id’] در اسکریپت ما ایجاد شده است.

هنگام استفاده از ChatGPT برای ساخت برنامه، مطمئن شوید که از همان Thread چت استفاده کنید و سعی کنید کامپوننت های مرتبط را در اسرع وقت تکمیل کنید. استفاده از یک Thread جدید چت یا استراحت طولانی ممکن است ناسازگاری ایجاد شود. اگر بین جلسات کدنویسی استراحت طولانی داشته باشید ChatGPT تمایل دارد برخی از جزئیات پروژه فعلی را فراموش کند (مثلا طرح رنگ).

برای تکمیل این برنامه ۱ ساعت و ۲۳ ساعت زمان صرف شد که صرفه جویی عالی در وقت و هزینه های شما ایجاد می کند.

نظرات و پیشنهادات شما؟

در آموزش ساخت سایت و برنامه نویسی با ChatGPT به زبان ساده امروز انزل وب ما سعی کردیم به سوال چگونه با ChatGPT کد بزنیم پاسخ دهیم. ChatGPT به وضوح یک دستیار برنامه نویسی قدرتمند است. اینکه ربات چت می‌تواند کدهای چشمگیر را از دستورالعمل‌های ساده و گاهی نه چندان واضح به دست بیاورد، گواهی بر توانایی آن در کدنویسی است. البته هنوز هم ایرادات زیادی دارد. با این حال، ربات چت می تواند به شما کمک کند تا برنامه های وب نسبتاً پیچیده را به سرعت بسازید. چنانچه در این رابطه  نظر یا پیشنهادی دارید در بخش نظرات این مطلب با ما در میان بگذارید.