توضیحات کلی فيلم آموزش ساخت فروشگاه اینترنتی
از آنجا که بحث آپلود فایل و عکس در اکثر پروژه ها کاربرد دارد و از سوی دیگر آموزشی کامل و جامع که تمامی جزییات و مسائل مربوط به آپلود فایل را مطرح نماید وجود نداشت، بر آن شدیم که تمامی جزییات و مسائل مرتبط با بحث آپلود فایل را مورد بررسی قرار دهیم. هدف آن است که فایل ها را با استفاده از ajax و به کمک php&jquery آپلود نماییم.طی چند فیلم آموزشی موارد زیر را به صورت کامل فرا خواهیم گرفت:
1) نمایش میزان درصد پیشرفت آپلود فایل به کمک progress bar یا نوار پیشرفت
2) امکان تعیین پسوندهای مجاز و نمایش پیغام خطا در صورت عدم رعایت پسوندهای مجاز
3) تعیین سقف ماکزیمم حجم فایل های آپلود شده و نمایش پیغام خطا به کاربر در صورت اقدام به آپلود فایل با حجم بیش از حد
4) نمایش preview یا پیش نمایش تصاویر آپلود شده ، پس از آنکه عملیات آپلود انجام شد.
5) امکان آپلود چندین فایل مختلف به صورت همزمان
6) بررسی سه حالت مختلف : basic,basic-plus,advanced که با توجه به هر پروژه می توان از هر یک از حالات استفاده نمود.
7) قابلیت نمایش حجم فایل های آپلود شده به کاربران
8) امکان کنسل کردن عملیات آپلود فایل
9) امکان آپلود اتوماتیک بدون آنکه نیاز به انتخاب دکمه آپلود باشد.(به محض انجام عملیات browse ، آپلود شروع می گردد)
10) بررسی پشتیبانی مرورگرهای مختلف از بحث آپلود فایل و File Api و هم چنین بررسی های مربوط به سمت سرور( جهت اطمینان ،زیرا ممکن است عملیات اعتبارسنجی فایل در سمت کاربر انجام نشود-به دلیل آنکه در سمت کاربر همه موارد بستگی به مرورگر شخص دارد)
11) امکان حذف، شروع آپلود،لغو عملیات آپلود برای چندین فایل انتخاب شده توسط کاربر
12) امکان تعیین مسیر فایل آپلود شده
13) قابلیت ایجاد پوشه جدید برای هر کاربر ، جهت جلوگیری از تداخل فایل های با نام مشابه
14) امکان دریافت مسیر آپلود فایل پس از انجام عملیات آپلود و سپس ذخیره سازی آن در دیتابیس
15) پشتیبانی از چندین روش مختلف آپلود جهت سازگاری بسیار بالا با مرورگرهای مختلف همانطور که دیدیم،بحث آپلود فابل گرچه در ابتدا ساده به نظر می رسد، اما با جزییات بسیاری همراه است.به همین دلیل در چند فیلم آموزشی، این بحث بسیار کارآمد و مهم را با تمام جزییات بررسی خواهیم کرد و پس از آن از این آموزش، در پروژه ساخت فروشگاه، جهت آپلود عکس در پنل کاربری (ثبت نام کاربر) استفاده خواهیم نمود.
سرفصل های فيلم آموزش ساخت فروشگاه اینترنتی
36
استفاده از type جهت استایل دهی در css
استفاده از انواع input ها جهت دریافت اطلاعات مربوطه، از کاربران(text,radio,..)
نحوه قرار دادن input ها دقیقا در یک ستون (بدون استفاده از جدول و فقط با استفاده از دستورات css )
چگونگی استایل دهی به input از نوع text و تنظیمات مربوط به این نوع input
مشخص نمودن فیلدهای ضروری (فیلدهای اجباری) فرم ثبت نام
تمرینی دیگر در مورد دستورات css از جمله font-family,font-size,float,background,...
ایجاد input هایی جهت مشخص نمودن جنسیت کاربر
اینکه چگونه می توان کاربر را مجبور کرد که فقط یک نوع جنسیت را انتخاب نماید؟به عبارتی تنها یکی از گزینه های مرد و یا زن قابل انتخاب باشد؟( کاربر نتواند هر دو مورد را انتخاب نماید- به عبارتی با انتخاب یکی از گزینه ها، گزینه دیگر از حالت انتخاب خارج شود)
چگونه می توانیم شکل ظاهری پیش فرض input های با type از نوع radio را عوض کرد؟
نحوه توپر کردن input ها به هنگام قرار گیری موس روی هر کدام
استفاده از دستور hover جهت تغییر پس زمینه در css
کاربردی دیگر از عبارت important و بررسی اهمیت آن در css
استفاده از دستورات jquery جهت تغییر background-position و چگونگی ثابت نمودن بک گراند، پس از کلیک نمودن روی هر بخش
37
کار با select ها در html
بررسی نحوه اختصاص ظاهری متفاوت با آنچه که مرورگرها به صورت پیش فرض ، تگ های select را نمایش می دهند.
بررسی چگونگی ایجاد لیست و افزودن آیتم های جدید با استفاده از option
کار با event از نوع change و کاربرد آن در jquery با جزییات مربوطه
کار با دستور find و مثالی کاریردی از این دستور مهم در jquery
کار با فایرباگ و رفع ایرادات موجود در زمینه css
تغییر جهت نوشتاری در input های انگلیسی (مانند ایمیل و ....)
کار با دستور text در jquery
نحوه استایل دهی به تگ های option و select در css و تنظیمات ظاهری آنها
چگونه با جی کوئری بفهمیم کاربر کدام استان را انتخاب نموده است؟
این کار را با کمک عبارت :selected انجام خواهیم داد.(این دستور در مورد input های دیگر هم کاربرد فراوانی دارد)
و...
همراه با نکاتی در زمینه css,html,jquery
38
افزودن لیستی جهت انتخاب شهر کاربر
ایجاد ناحیه متنی برای دریافت آدرس پستی کاربر
نحوه محدود کردن سایز ناحیه متنی ایجاد شده با استفاده از دستورات css و عدم اجازه به کاربر برای تغییر سایز ناحیه متنی ایجاد شده
تنظیم جهت نوشتاری ناحیه متنی و هم چنین دستورات استایل مربوط به آن با جزییات کامل
استفاده از input با type از نوع checkbox جهت ایجاد چک باکس در سایت
بنابراین، تا کنون با input های text,password,radio,checkbox
تمرین دیگری در زمینه فایرباگ و رفع ایرادات موجود در زمینه استایل دهی
نحوه تغییر شکل پیش فرض checkbox ها و ایجاد ظاهر بسیار زیباتر با ترفند opacity=0
کار با پلاگین jquery و بررسی دستور toggleClass و کاربرد این دستور در تغییر استایل ها
بررسی تفاوت های استایل دهی دو نوع input از نوع radio و checkbox
تغییر background-position به کمک class ها در پلاگین jquery
39
بررسی کاربرد و فایده استفاده از کد کپچا در وب سایت
استفاده از تابع imagecreate جهت ایجاد متغیری که حاوی عکس کپچا یا کد امنیتی است و کار با این دستور
ایجاد تابعی تحت عنوان image_create جهت تولید عکس کپچا
استفاده از دستور imagefilledrectangle و تضیحات کامل در مورد کاربرد این تابع در ساخت کپچا
بررسی نحوه تبدیل سیستم رنگ بندی RGB به سیستم قابل استفاده در php و تعیین رنگ بندی عناصر کپچا
کار با تابع imagecolorallocate را نیز به صورت دقیق و با جزییات کامل بررسی خواهیم نمود.
مفهوم و کاربرد تابع imageline و بررسی آرگومان های این تابع و نحوه ترسیم لاین جدید روی عکس کپچا
چگونگی تعیین رنگ، نقطه ابتدایی،نقطه انتهایی خط مورد نظر را نیز خواهیم دید.
کار با دستور rand جهت تولید عدد تصادفی در php در یک بازه خاص عددی
استفاده از تابع imagepng و دریافت خروجی png
نحوه ایجاد تعداد زیادی نقطه (پیکسل) در تصویر کپچا با استفاده از تابع imagesetpixel
نحوه تعیین رنگ بندی نقاط فوق و هم چنین کاهش یا افزایش تراکم نقاط ترسیم شده
بررسی نحوه تولید یک رشته تصادفی شامل حروف و اعداد
برای تولید یک رشته عددی تصادفی، به سادگی می توان از rand استفاده نمود اما برای تولید یک رشته تصادفی که شامل حروف باشد، نیاز به پیاده سازی سیستمدیگری داریم.
کاربرد دستور strlen در php و کاربرد این دستور در تولید رشته تصادفی با استفاده از php
نوشتن text یا متن روی تصویر کپچای ایجاد شده
چگونگی لود فونت و تعیین فونت نوشتاری کد کپچای تولید شده و هم چنین بررسی نحوه مشخص نمودن سایز فونت و رنگ کد کپچا
تعیین میزان چرخش حروف موجود در تصویر به صورت random
بررسی کامل تابع imagettftext و تنظیمات و مشخصات مربوط به این تابع به صورت بسیار دقیق و جامع
همراه با نکاتی دیگر در زمینه php.
40
بررسی نحوه استفاده از کپچا جهت تشخیص روبات ها
کاربرد SESSION در بحث کپچا و توضیحاتی در مورد نحوه چک کردن صحت کد ورودی توسط کاربر
ایجاد input جدیدی از نوع text و انجام عملیات 72 ورود کپچا توسط کاربر
قرار دادن یک تگ img جهت نمایش کپچا به کاربر
نحوه تغییر سورس عکس هنگام رفرش شدن صفحه
استفاده از ajax و ارسال درخواست به صفحه تولید کپچا، جهت تولید عکس کپچا
کار با دستور attr در jquery
توضیحات کامل در مورد ajax در jquery و دریافت خروجی از این دستور ( به درخواست یکی از کاربران)
نکاتی دیگر در زمینه jquery+php+css به همراه ajax.
41
کار با تابع microtime و خروجی های مختلف این تابع
تبدیل خروجی تابع فوق، به یک رشته از نوع float و سپس استخراج میلی ثانیه
آشنایی با دستور round در php به همراه چندین مثال
نام گذاری عکس های کپچای تولید شده بر حسب زمان ساخت آنها برحسب میلی ثانیه
کار با یکی از مهم ترین دستورات فایلینگ در php تحت عنوان glob جهت دسترسی به فایل های موجود در سرور
آشنایی با آرایه ها و هم چنین نحوه دسترسی به تک تک عناصر موجود در آرایه با استفاده از حلقه foreach
بحث در مورد حذف کپچاها به صورت جامع
مشکل در مورد حذف عکس ها آن است که قبل از لود شدن عکس تسط مرورگر کاربر، ما اجازه حذف عکس را نداریم. چرا که در این صورت کاربر عکس کپچای تولید شده را نخواهد دید.
بنابراین ما باید شرطی را اضافه کنیم که ابتدا بررسی کند که عکس کپچای موجود در سرور چه مدت زمان است که ساخته شده است؟ سپس در صورت برقراری شرط مد نظر ما عکس حذف شود.
عملا باید بتوانیم تاریخ انقضایی برای عکس های کپچای تولید شده تعریف نماییم.
کار با دستورات مربوط به حرف فایل در php
42
موضوع این بخش:PHP+AJAX+JQUERY | در این بخش بحث های باقی مانده در مورد کپچا را تکمیل خواهیم نمود و سپس به سراغ بحث جدید یعنی اعتبارسنجیفرم ثبت نام خواهیم رفت.معنای اعتبارسنجی آن است که قبل از انجام عملیات ثبت نام و ذخیره سازی اطلاعات در دیتابیس ابتدا بررسی خواهیم نمود که آیا اطلاعات وارد شده توسط کاربر صحت دارد یا خیر؟
اعتبارسنجی در اصل به دو صورت انجام می پذیرد، سمت سرور و سمت کاربر.اعتبارسنجی سمت سرور نسبت به اعتبارسنجی سمت کاربر اطمینان بیشتری دارد چرا که در سمت سرور همه چیز به مرورگر شخص بستگی دارد.
در این بخش ابتدا بحث اعتبارسنجی سمت کاربر را مورد بررسی قرار خواهیم داد. اعتبار سنجی در مورد فیلدهای مختلف معنا و مفهوم متفاوتی پیدا می کند به عنوان مثال در مورد نام کاربر ما تنها می توانیم خالی نبودن فیلد را بررسی کنیم. اما در مورد ایمیل فرمت کلی ایمیل را بررسی خواهیم نمود.
چگونه با هر بار کلیک روی عکس کپچا، کد کپچای جدیدی را به کاربر نمایش دهیم؟
استفاده از فرم ها برای ارسال اطلاعات و بررسی خصوصیت های مختلف آن
انتخاب input های ایجاد شده بر اساس name آنها
دریافت مقداری که کاربر به عنوان نام خود وارد نموده است (با استفاده از دستورات jquery)
کار با ajax و تمرینی دیگر در زمینه ایجکس با جی کوئری
نحوه عدم اجازه به فرم برای انجام عملیات submit بدین صورت که اگر اعتبارسنجی نتیجه منفی داشت فرم اجازه submit را نخواهد داشت.
کار با return در function ها و کاربرد آن در بحث اعتبارسنجی
45
موضوع این بخش:JQUERY+JAVASCRIPT |در این بخش از مجموعه آموزشی ساخت فروشگاه اینترنتی، قصد داریم ادامه بحث اعتبارسنجی فرم ثبت نام را تکمیل نماییم.
افزودن این شرط به فیلد پسورد: پسورد حداقل باید 5 کاراکتر دلخواه باشد و در صورتی که کمتر از 5 کاراکتر به عنوان پسورد انتخاب گردد به کاربر پیغام خطا را نمایش دهیم .
پس از انتخاب پسورد صحیح توسط کاربر، بررسی می کنیم که آیا پسورد با تاییدیه پسورد مطابقت دارد یا خیر؟ در صورتی که شرط برقرار نبود باز هم پیغام خطای مناسب را نمایش دهیم.
مثالی دیگر از کاربرد عبارات باقاعده و نحوه استفاده از آنها جهت اعتبارسنجی فرم ثبت نام
بررسی شفاهی راه های نمایش پیغام های خطا به کاربر
اعتبارسنجی تلفن همراه کاربر با کمک دستور test در جاوااسکریپت
بررسی صحت کد پستی وارد شده توسط کاربر
بررسی اینکه آیا کاربر آدرس پستی خود را وارد نموده است یا خیر؟
بررسی تفاوت استفاده و عدم استفاده از کاراکترهای ^ و $ و اینکه در چه مواقعی استفاده از این کاراکترها ضروری است؟( همراه با مثال های کاملا شهودی)
استفاده از سلکتور name در jquery
کاربردی دیگر از دستور val در jquery به همراه مثال های متعدد دیگر در این زمینه
46
موضوع این بخش:JQUERY+JAVASCRIPT+PHP |در بخش چهل و ششم از مجموعه آموزشی ساخت فروشگاه آنلاین ابتدا بخش مربوط به انتخاب استان رااعتبارسنجی خواهیم نمود.بدین صورت که اگر کاربر، استان خود را انتخاب نکرده بود،به وی اجازه ادامه ثبت نام را نخواهیم داد.پس از آن همین کار را در مورد انتخاب شهر نیز پیاده سازی خواهیم نمود.
کار با دستور selected و بدست آوردن تگ option انتخاب شده توسط کاربر
اختصاص value به هر یک از تگ های option (یا به عبارت دیگر هر یک از استان ها)
تعریف class جدید برای نمایش خطای مناسب، به کاربر، در صورت عدم انتخاب استان یا شهر
در ادامه به بررسی صحت کد کپچای ورودی خواهیم پرداخت.
استفاده از ajax جهت بررسی کد کپچای وارد شده و اطمینان از صحت کد وارد شده
مثالی دیگر از نحوه کار با دستورات ajax در jquery
ارسال کد کپچای وارد شده توسط کاربر به صفحه ای دیگر و سپس مقایسه آن با SESSION مربوط به کپچا
بررسی مفهوم async در ajax به صورت کاملا شهودی و کاربردی با تشریح جزییات کامل
دستورات ajax در مفهوم اصلی به صورت غیرهمزمان یا آسینکرون هستند، در این بخش به بررسی مفهوم سینکرون و آسینکرون در عملیات ajax خواهیم پرداخت.
50
موضوع این بخش:PHP+JQUERY+AJAX | به دوستانی که این مجموعه را تا اینجای کار دنبال کرده اند تبریک عرض می کنیم ، به خاطر صبر و پشتکاری که در زمینه برنامه نویسی به خرج داده اند و این مژده را به آنها می دهیم که تا کنون مطالب بسیار مهمی را فراگرفته اند که به جرات در هیچ آموزشی به این شکل و با این جزییات مطالب را بسط نمی دهند.
و هم چنین این مژده را به این دوستان صبور و پرتلاش می دهیم که مسیر کاری و شغلی بسار پردرآمد و جذابی را انتخاب نموده اند که برای ایشان آرزوی موفقیت داریم و تا انتهای ورود به بازار کار نیز در این مسیر با شما خواهیم ماند.
در ادامه به این بحث خواهیم پرداخت که چگونه زمانی که کاربر یک استان را انتخاب نمود ما لیست شهرهای همان استان را در بخش انتخاب شهر به نمایش بگذاریم.
یادآوری در مورد رویداد یا event از نوع change
کاربرد مجدد دستور find در jquery
نحوه دریافت id استان انتخاب شده توسط کاربر
ارسال دیتا و اطلاعات لازم، به صفحه ای جدید و سپس دریافت موارد لازم از دیتابیس
ایجاد صفحه ای جدید جهت نوشتن دستورات مربوط به ارتباط با دیتابیس و سپس دریافت شهرهای استان مورد نظر
بازگرداندن اطلاعات دریافت شده به صفحه قبل (با استفاده از ajax) و سپس نمایش لیست شهرها در لیست انتخاب شهرها
مثالی دیگر از PDO و نحوه نوشتن کوئری و سپس prepare و execute نمودن کوئری ها در php
رفع مشکلات جزیی که در سایت 5040 دیده می شود و بهبود کدنویسی جهت افزایش میزان userfriend بودن پروژه.
51
موضوع این بخش:PHP | بالاخره پس از چندین جلسه که در مورد اعتبارسنجی صحبت شد، نوبت به آن می رسد که به سراغ ذخیره اطلاعات در دیتابیس برویم. در tblozv فیلدهای مورد نیاز برای نام کاربر،موبایل،پسورد،کدپستی،جنسیت،آدرس پستی و... را خواهیم ساخت.
سپس صفحه action فرم را کدنویسی می کنیم.
چگونگی و ضرورت چک کردن کد کپچا در سمت سرور (علاوه بر سمت کاربر)
بررسی نحوه دریافت input های مختلف از جمله checkbox,text,radio,... در صفحه action فرم
بررسی وجود یا عدم وجود مقادیر پست شده با استفاده از دستور isset
کاربرد مجدد SESSION ها یا متغیرهای سراسری
مجددا استفاده از دستورات PDO و نحوه آماده سازی و اجرای کوئری در PDO
استفاده از کوئری insert و ثبت اطلاعات در دیتابیس
در جلسه بعد به چند نکته امنیتی بسیار مهم وضروری در مورد فرم ثبت نام خواهیم پرداخت.
به همراه نکاتی دیگر در زمینه php.
55
موضوع این بخش:آپلودفایل(بخش دوم)| در بخش پنجاه و پنجم از مجموعه آموزش تصویری ساخت فروشگاه آنلاین، قصد داریم نحوه استفاده از مدل basic-plusپلاگین مربوط به آپلود را مورد بررسی قرار دهیم.
نحوه تعیین آپلود فایل به صورت اتوماتیک یا دستی(autoupload)
نحوه تعیین پسوندهای مجاز آپلود (به عنوان مثال در مورد تصویر:jpg,jpeg,png,...)
تعیین ماکزیمم حجم قابل آپلود
تنظیمات مربوط به پیش نمایش تصاویر آپلود شده
نوشتن دستورات جی کوئری مربوط به آپلود فایل
56
موضوع این بخش:آپلودفایل(بخش سوم)| در بخش پنجاه و ششم از مجموعه آموزش تصویری ساخت فروشگاه آنلاین،ادامه مبحث آپلود فایل را پی می گیریم.
توضیحات کدهای جی کوئری مربوط به پلاگین File Upload Jquery
بررسی نحوه افزودن دستوراتی به پلاگین، در حال اجرای عملیات آپلود فایل
افزودن توابعی به پلاگین،جهت اجرا شدن پس از اتمام عملیات آپلود
نحوه دریافت خطای رخ داده (حجم ماکزیمم،پسوند مجاز و... )
چگونگی دریافت آدرس فایل آپلود شده
تشریح مفهوم توابع fileuploaddone,fileupload,fileuploadadd و کاربردهای آن در این پلاگین
کاربرد دستورات file.url,file.error و... جهت دریافت نتیجه آپلود فایل
و کار با دستورات و توابع این پلاگین جهت شخصی سازی پلاگین.
60
موضوع این بخش:آپلودفایل(بخش هفتم) در ثبت نام کاربران| در بخش شصتم از مجموعه آموزش تصویری ساخت فروشگاه آنلاین،ادامه مبحث آپلود فایل را پی می گیریم.در این بخش قصد داریم،نحوه ذخیره سازی آدرس فایل آپلود شده ، در دیتابیس را بررسی کنیم.
ذخیره آدرس فایل در input با type=hidden
دریافت آدرس فایل آپلود شده با استفاده از file.url
استفاده از دستور val در جی کوئری جهت تغییر مقدار value تگ input فوق
استفاده از دستورات PDO جهت ذخیره سازی آدرس فایل در دیتابیس
کار با کوئری insert جهت درج اطلاعات در جدول مورد نظر
61
موضوع این بخش:کار با تاریخ هجری شمسی در php| در بخش شصت و یکم از مجموعه آموزش تصویری ساخت فروشگاه آنلاین،با نحوه تبدیل تاریخ میلادی (تاریخ پیش فرض php) به تاریخ هجری شمسی آشنا خواهیم شد.
تبدیل تاریخ میلادی به هجری شمسی جهت ثبت تاریخ ثبت نام کاربر در سایت
بررسی فرمت های مختلف تاریخ هجری شمسی بر اساس روز ماه و سال
ذخیره سازی تاریخ در دیتابیس به کمک کوئری insert و دستورات PDO
کار با تاریخ هجری شمسی و فرمت های مختلف خروجی به یک فروشگاه محدود نمی شود، در سایت های خبری،شبکه های اجتماعی و... نیز کاربرد فراوانی دارد . به همین دلیل بر آن شدیم تا در یک بخش به صورت کامل در مورد کار با تاریخ شمسی در php بپردازیم.
پیش نمایش فیلم آموزش ساخت فروشگاه اینترنتی
درس شماره 1 زمان فیلم: 21:31
دانلود مستقیم پیش نمایش (درس شماره 1 ساخت فروشگاه اینترنتی ) - حجم دانلود 73 مگابایت (کلیک کنید +)
درس شماره 2 زمان فیلم: 16:27
دانلود مستقیم پیش نمایش (درس شماره 2 ساخت فروشگاه اینترنتی ) - حجم دانلود 64 مگابایت (کلیک کنید +)
درس شماره 25 زمان فیلم: 38:29
دانلود مستقیم پیش نمایش (درس شماره 25 ساخت فروشگاه اینترنتی ) - حجم دانلود 148 مگابایت (کلیک کنید +)
درس شماره 40 زمان فیلم: 22:07
دانلود مستقیم پیش نمایش (درس شماره 40 ساخت فروشگاه اینترنتی ) - حجم دانلود 78 مگابایت (کلیک کنید +)
درس شماره 71 زمان فیلم: 20:11
دانلود مستقیم پیش نمایش (درس شماره 71 ساخت فروشگاه اینترنتی ) - حجم دانلود 80 مگابایت (کلیک کنید +)
دیدگاهها
سلام خسته نباشی
میخواستم یک قسمت رایگان از این پکیج رو اگه ممکنه بذارید
ممنونم
سلام
در لینک زیر، سعی کرده ایم پارت اول را بصورت متنی ارائه کنیم:
beyamooz.com/%D9%BE%D8%B1%D9%88%DA%98%D9%87-%D9%81%D8%B1%D9%88%D8%B4%DA%AF%D8%A7%D9%87-%D8%A7%DB%8C%D9%86%D8%AA%D8%B1%D9%86%D8%AA%DB%8C
سلام
ممنون برای اموزش های خوبتون میخاستم این قسمت دو تا اخرش رو بخرم ولی تخفیف نداره لطفا تخفیف رو فعال کنید تا بتونم بخرم ممنون
کد تخفیف به ایمیل تون ارسال گردید.
با سلام و خسته نباشید.
عالی بود.