آموزش در 20 روز از Scratch یک شبکه اجتماعی بسازید: PHP + MYSQL، Js

سرفصل ها و درس ها

روز 1: معرفی دوره: اطلاعات و راه اندازی Day 1: Course Intro: Info & Setup

• به دوره خوش آمدید (همان مقدمه) Welcome to the course (Same as intro)

• XAMPP را بارگیری و نصب کنید Download and install XAMPP

• ویرایشگر کد را بارگیری ، نصب و پیکربندی کنید Download,install and config code editor

• پوشه لازم را ایجاد کنید Create necessary folder

روز 2: با موبایل یا ایمیل و سیستم فایل لازم ثبت نام کنید Day 2: Create Sign Up with mobile or email and necessary file system

• پروژه کامل کد منبع و فایل منبع Complete Project Source code & Resource File

• منابع بخش Section resources

• ایجاد ساختار html ساختار Create Sign up html structure

• طراحی صفحه ثبت نام Design Sign up page

• با استفاده از javascript تاریخ تولد ایجاد کنید Create birthday date using javascript

• درک روند ارسال فرم Understanding form submission process

• اتصال سایت با پایگاه داده MYSQL Connecting site with MYSQL database

• جدول پایگاه داده کاربر ایجاد کنید Create user database table

• ذخیره و اعتبارسنجی داده های فیلد ورودی Storing and validating input field data

• کلاس کاربر و پست ایجاد کنید Create User and Post class

• ایجاد شی در پرونده بارگذاری Create object in load file

• روش ورودی را ایجاد کنید Create check input method

• بیان منظم برای تأیید شناسه ایمیل Regular expression to validate email id

• درک و ساخت روش "ایجاد" Understanding and constructing 'Create' method

• درج داده و سیستم آزمایش Inserting data and testing system

• ایجاد سیستم نشانه Create token system

• تکمیل سیستم ثبت نام Completion of sign up system

روز 3: با ایمیل یا تلفن همراه وارد سیستم شوید Day 3: Log in system with email or mobile

• منبع بخش Section resource

• وارد ساختار html شوید Log in html structure

• طراحی کد ورود به سیستم Design Log in code

• ورود به توسعه Backend Log in backend development

روز چهارم: صفحه پروفایل Day 4: Profile page

• بخش بخش Section resource

• ایجاد ساختار html صفحه پروفایل Create profile page html structure

• طراحی نمایه سمت چپ بالای سمت چپ Design profile topbar left side

• طراحی سمت راست بالای صفحه نمایه Design profile topbar right side

• آیکون Topbar ویرایش Topbar icon edit

• برای ورود به سیستم سیستم ایجاد کنید Create system to stay logged in

• userid را با نام دریافت کنید Get userid by name

• جدول نمایه ایجاد کنید Create profile table

• روش ذخیره سازی مشخصات نمایه ایجاد کنید Create profile data storing method

روز پنجم: سیستم عکس عکس و جلد جلد Day 5: Cover photo and profile photo system

• بخش بخش Section resource

• طراحی عکس روی جلد Cover photo design

• پوشش دکمه عکس js Cover photo button js

• داده های عکس به پایگاه داده ارسال می شود Photo data sent to database

• عکس روی جلد کامل شد Cover photo completed

• طراحی عکس پروفایل Designing profile photo

• جعبه گفتگوی عکس پروفایل Profile picture dialogue box

• سیستم آپلود عکس پروفایل کامل Complete profile photo upload system

• قسمت پایین را بپوشانید Cover bottom part

• اصلاح UserLInk UserLInk rectification

روز ششم: سیستم ارسال متن و عکس با شکلک Day 6: Text and Photo Posting System with emoji

• منبع بخش Section resource

• مقدمه کاربر را طراحی کنید Design user intro

• جعبه پست 1 را طراحی کنید Design post box 1

• جعبه پست 2 را طراحی کنید Design post box 2

• طراحی منطقه اقدام ارسال Design post action area

• شکلک تنظیم کنید Set emoji

• از دکمه جاوا اسکریپت استفاده کنید Use javascript on post button

• پیش نمایش تصویر ارسال کنید Post image preview

• ایجاد سیستم پست 1 Create post system 1

• ایجاد سیستم ارسال پیام 2 Create posting system 2

• پایگاه داده ارسال را ایجاد کنید Create post database

• پست را در پایگاه داده ذخیره کنید Store post to database

• نمایش پست 1 Display post 1

• نمایش پست 2 Display post 2

• نمایش پست کامل است Display post complete

• نمایش تصویر ارسال کنید Post image show

• نمایش تصویر نشان می دهد 2 Post image show 2

• نمایش پست تصویر کامل است Image post show complete

• نوشتن جاوا اسکریپت برای پست ویرایش Write javascript for post edit

• گزینه ویرایش پست را ایجاد کنید Create post edit option

• ارسال ویرایش php Post edit php

• حذف پست از جدول زمانی Delete post from timeline

روز 7: سیستم واکنش نشان دهید Day 7: React System

• منبع بخش Section resource

• جدول واکنش ایجاد کنید Create react table

• واکنش اصلی html 1 React main html 1

• روش Main count count را ایجاد کنید Create Main react count method

• Javascript را برای واکنش اصلی بنویسید Write Javascript for main react

• واکنش اصلی ارائه Main react submit

• واکنش اصلی کامل است Main react complete

• ایجاد سیستم برای نوع واکنش دیگر Create system for other react type

• سایر سیستم های واکنش پذیر را کامل کنید Complete other react type system

روز 8: سیستم نظرات Day 8: Comment System

• منبع بخش Section resource

• ایجاد جدول نظرات Create comments table

• ایجاد روش نظر Create comment method

• نوشتن کد برای نظر نمایش بخش 1 Write code for comment show part 1

• برای نمایش نظر ، کد قسمت 2 را بنویسید Write code for comment show part 2

• روش شمارش نظر ایجاد کنید Create comment count method

• روند ارسال نظر Comment submission process

• واکشی آخرین نظر و نشان دادن نماد واکنش Fetching last comment and showing react icon

• عملکردی ایجاد کنید تا درمورد نظر واکنش نشان دهید Create functionality to react on comment

• نمایش نظر واکنش js php Show comment react js php

• اظهار نظر در مورد اتمام واکنش نشان می دهد Comment react completion

• برای ویرایش نظر ، قابلیت ایجاد کنید Create functionality to edit comment

• روش به روزرسانی و ایجاد نظر ایجاد کنید Create comment update and delete method

روز 9: سیستم پاسخ Day 9: Reply system

• منبع بخش Section resource

• روش واکشی پاسخ ایجاد کنید Create reply fetch method

• تعداد پاسخ واکنش و تعداد نمایش حداکثر را ایجاد کنید Create reply react count and max show method

• روش بررسی واکنش و خطای مدیریت را ایجاد کنید Create react check method and handling error

• js بنویسید و ورودی پاسخ بگیرید Write js and get reply input

• پاسخ کامل نظر دادن Complete reply commenting

• برای ارسال پاسخ ، نوع عملکرد دیگری را ایجاد کنید Create functionality to submit reply other react type

• ارسال پاسخ پاسخ دادن به روند ارسال Write reply react submit process

• مدیریت خطا و ایجاد سیستم حذف پاسخ Error handling and create reply delete system

• تکمیل پاسخ دادن به پاسخ Completion of reply reacting

• گزینه ویرایش پاسخ ایجاد کنید Create reply edit option

• گزینه ذخیره و حذف ویرایش پاسخ را ایجاد کنید Create reply edit save and delete option

• تکمیل پاسخ Reply completion

• پاسخ رفع اشکال Reply bug fix

روز دهم: اشتراک سیستم Day 10: Share system

• منبع بخش Section resource

• گزینه اشتراک گذاری ایجاد کنید Create share option

• برای ذخیره و نمایش پست مشترک قابلیت ایجاد کنید Create functionality to store and show shared post

• گزینه ویرایش پست مشترک ایجاد کنید Create shared post edit option

• نمایش به اشتراک گذاری کامل Complete share show

• گزینه ویرایش پست مشترک ایجاد کنید Create shared post edit option

روز 11: جستجوی زنده Day 11: Live Search

• منبع بخش Section resource

• قابلیت هایی را برای جستجوی زنده ایجاد کنید Create functionality for live searching

• ایجاد سیستم جستجوی زنده Complete creating live searching system

روز دوازدهم: سیستم درخواست دوستان Day 12: Friend Request System

• منبع بخش Section resource

• ایجاد جدول پایگاه داده درخواست Create request database table

• قابلیت بررسی درخواست ایجاد کنید Create request check functionality

• وضعیت درخواست را بررسی کنید و js را بنویسید Check request status and write js

• نوشتن جاوا اسکریپت برای درخواست لغو و دوست داشتنی Write javascript for request cancel and unfriend

• درخواست را تأیید کنید Confirm request

روز سیزدهم: سیستم را دنبال کنید Day 13: Follow system

• منبع بخش Section resource

• جدول زیر را ایجاد کنید Create follow table

• سیستم follow را ایجاد کنید Create follow system

• تکمیل سیستم follow Completion of follow system

• پرونده .htaccess ایجاد کنید Create .htaccess file

روز چهاردهم: ایجاد بخش درباره Day 14: Create About Section

• در مورد دسته ایجاد کنید Create about category

• برای قسمت ورودی رشته دیگر کد بنویسید Write code for other category input field

• برای قسمت ورودی رشته دیگر کد بنویسید 2 Write code for other category input field 2

• جاوا اسکریپت را برای قسمت ورودی گروه بنویسید Write javascript for category input field

• در مورد قسمت بازگردانی پنهان About category field hidden restore

• درباره بخش کامل شد About section complete

روز پانزدهم: نمایش لیست پیروان دوست Day 15: Showing friend followers list

• ایجاد سیستم خروج از سیستم Create logout system

• صفحه دوست ایجاد کنید Create friend page

• برای نمایش لیست دوستان روش ایجاد کنید Create method to show friend list

• نمایش لیست دوستان Display friend list

• نمایش لیست دنبال کردن Display follow list

• تعویض frend follower-js Switch frend follower-js

• نمایش عکس های جدول زمانی در برگه عکس Display timeline photos in photo tab

روز شانزدهم: سیستم پیام رسانی Day 16: Messaging system

• منبع بخش Section resource

• جدول پیام ایجاد کنید Create message table

• داده های کاربر را بارگیری کنید Load user data

• برای بارگذاری آخرین کاربر با داده پیام ، روش ایجاد کنید Create method to load last user with message data

• رابط پیام رسان ایجاد کنید Create messenger interface

• js را برای لیست کاربران پیام رسان بنویسید Write js for messenger user list

• ایجاد یک جعبه کاربر Create single user box

• روش داده پیام را ایجاد کنید Create message data method

• نمایش پیام Show message

• ارسال اطلاعات پیام در پایگاه داده Send message data in database

• ورودی پیام منطقه را فعال کرده و شکلک را تنظیم کنید Activate text area message input and set emoji

• ارسال پیام با emoji Send message data with emoji

• بارگیری پیام و جستجوی کاربر Load message and search user

• نمایش پیام از نتیجه جستجو Show message from search result

• پیام کامل شد Message complete

روز هفدهم: سیستم اطلاع رسانی Day 17: Notification system

• منبع بخش Section resource

• ایجاد جدول اعلان Create notification table

• ذخیره اطلاعات هشدار Notification data store

• ایجاد و کار با روش اطلاع رسانی Create and work with notification method

• ایجاد رابط اعلان Create notification interface

• CSS حل CSS solve

• جاوا اسکریپت را برای اطلاع رسانی بنویسید Write javascript for notification

• نمایش تعداد اعلان ها Notification count show

• طراحی و فعال کردن آیکون اعلان Design and activate notification icon

• نمایش لیست نمایش Request list show

• درخواست اعلان انجام شد Request notification done

• ایجاد صفحه ارسال Create post page

• اعلانی برای پیام ایجاد کنید Create notification for message

• اعلان پیام کامل شد Message notification complete

روز هجدهم: ایجاد صفحه اصلی Day 18: Create Home page

• منبع بخش Section resource

• تفکیک فایل php php file separation

• تفکیک فایل php 2 php file separation 2

• ایجاد صفحه اصلی Create Home page

روز نوزدهم: تنظیم حساب Day 19: Account Setting

• منبع بخش Section resource

• گزینه تنظیمات را ایجاد کنید Create settings option

• صفحه تنظیمات طراحی Design settings page

• تنظیم تنظیم لینک کاربر Create userlink setting

• تنظیمات را برای تلفن همراه ایجاد کنید Create settings for mobile

• تنظیمات را برای ایمیل ایجاد کنید Create settings for email

• تنظیمات تنظیم مجدد رمز عبور Password reset settings

روز 20: سیستم مسدود کردن Day 20: Blocking system

• منبع بخش Section resource

• منبع بخش Section resource

• ایجاد جدول بلوک Create block table

• دکمه بلوک ایجاد کنید Create block button

• نوشتن js و ایجاد روش برای مسدود کردن سیستم Write js and create method for blocking system

• نمایش پیام را مسدود کنید Block message show

• تکمیل سیستم مسدود کردن Completion of blocking system

پاداش: سیستم ذکر Bonus: Mention system

• کد منبع Source code

• ایجاد روشی برای نمایش کاربران پیشنهادی Create method to display suggest users

• داده های ارسالی به پایگاه داده را ذکر کنید Mention data sent to database

• ذکر سیستم کامل Mention system complete

نتیجه گیری - شما موفق شدید. Conclusion - You made it.

• تبریک می گویم Congratulation