باعث حذف کامنت ها و دستورات بلا استفاده میگردد، که در نتیجه باعث کاهش حجم فایل شده. (تأثیری در نتیجه اجرای برنامه نخواهد داشت)
مفاهیم پایه ای :
Javascript
زبان برنامه نویسی ای است که برای استفاده در Browser یا همان مرورگر طراحی شده است. (این زبان هیچ ربطی به زبان Java شرکت اوراکل ندارد و فقط تشابه اسمی است.)
جاوا اسکریپت در سمت کلاینت اجرا میشود. بوسیله آن میتوان به عناصر درون صفحه وب دسترسی داشت و با آنها کار کرد.
یک تکه کد ساده جاوا اسکریپت بدین شکل میباشد:
<script> alert("hello world!"); </script>
که باعث میشود یک پیغام به کاربر نمایش داده شود.
Ajax
Ajax روشی است که در آن توسط جاوااسکریپت میتوان اطلاعات را از سرور دریافت و یا به سرور ارسال کرد بدون آنکه نیاز باشد کل یک صفحه رفرش شود.
Ajax مخفف Asynchronous JavaScript and xml میباشد اصطلاح آسنکرون اشاره دارد به این موضوع که وقتی درخواستی برای لود کردن قسمتی از سایت ارسال میشود مابقی صفحه به اصطلاح فریز نشده و منتظر پاسخ نمی ماند بلکه عمل لودینگ فقط در همان قسمت از صفحه اتفاق افتاده. (یک مثال واضح تر مثلا در صفحه محصولات سایت دیجی کالا هستید و از قسمت مرتب سازی گزینه قیمت را انتخاب میکنید تا محصولات بر اساس قیمت مرتب شوند در این جا مشاهده میکنید که کل سایت رفرش نمیشود بلکه فقط همان قسمتی که لیست محصولات را نمایش میدهد لحظه ای کمرنگ تر شده و دوباره اطلاعات نمایش داده میشود.)
برای ارسال یا دریافت اطلاعات در Ajax از xml و یا JSON استفاده میشود.
jQuery
jQuery کتابخانه ای از جاوا اسکریپت است و به منظور سهولت بخشیدن در استفاده از کدهای جاوا اسکریپت طراحی شده است. مثلا برای ساخت یک انیمیشن و یا استفاده از Ajax با حداقل کدهای jQuery این امر امکان پذیر میباشد در صورتی که همین موارد را اگر بخواهیم با جاوا اسکریپت پیاده سازی کنیم نیازمند نوشتن کدهای بیشتری خواهیم بود.
AngularJS
AngularJS فریم ورک MVC برای جاوا اسکریپت میباشد که توسط گوگل ساخته شد و روش هایی را مهیا میکند تا به سادگی و به سرعت بتوان وب سایت های Single-Page را طراحی کرد.
Node.js
تا قبل از Node.js برنامه نویسان مجبور بودند دو زبان برنامه نویسی را یاد بگیرند یکی برای سمت سرور (backend) مانند asp یا php و دیگری سمت کلاینت یا (frontend) مانند جاوااسکریپت. اما بوسیله Node.js برنامه نویسان میتوانند از javascript به همان خوبی که سمت کلاینت استفاده میکردند سمت سرور هم استفاده کنند. در واقع با یادگیری یک زبان برنامه نویسی میتوان هم سمت کلاینت و هم سمت سرور برنامه نویسی کرد.
یکی از اصلی ترین دلایل استفاده از بوت استرپ Grid بندی صفحه است که به کمک اون خیلی راحت میشه از دست جداول و به هم ریختگی Div ها راحت شد.
در بوت استرپ هر ناحیه به 12 قسمت تقسیم میشه. (علت استفاده از عدد 12 فکر میکنم اینه که به اعداد بیشتری تقسیم پذیر هست: مثل 1و2و3و4و6)
برای شروع بخش بندی صفحه همیشه ابتدا یک Div با کلاس Container میگذاریم و تمام عناصر صفحه را داخل این Div میگذاریم. برای بخش بندی ها همیشه با یک div با کلاس Row شروع میکنیم که معادل یک dr میباشد.
حالا داخل این row میتوانیم div های دیگری بگذاریم مثلا اگر بخواهیم دو div داشته باشیم که هر دو یک اندازه باشند و کل ناحیه را بگیرند برای هر کدام از این div ها کلاس col-md-6 را میگذاریم. باید توجه داشته باشیم که در هر row (هرناحیه) جمع این اعداد نباید بیشتر از 12 باشد مثلا در مثال بالا دوتا 6 تا داریم.
col-md-6 : در این مثال md یعنی medium به این منظور که تا جایی که صفحه medium است div ها به اصطلاح نشکند و زیر هم قرار نگیرد و از آن اندازه کوچکتر بشکند. اگر مرورگر را خودتان resize کنید و کوچک کنید از یک جایی به بعد div ها میشکند.
به جز md چند حالت دیگر هم در بوت استرپ داریم مثل:
Tablet> Small : sm
Mobile> Extra Small : xs
Monitor> Medium : md
LCD > Large :lg
شیفت دادن ستون ها:
با دستور offset به صورت مثلا col-md-offset-3 سه واحد به جلو حرکت میدهد. البته میتوان از دستور push یا pull هم استفاده کرد. تفاوت offset با push این است که offset بقیه عناصر را هم به جلو شیفت میدهد اما push روی بقیه عناصر می اندازد.
راستی برای نصب آخرین ورژن بوت استرپ کافیست دستور زیر رو در nuget بزنید.
install-Package Bootstrap
bootstrap theme:
در کنار فایل های اصلی بوت استرپ یک فایل bootstrap-theme.css هم وجود داره. این فایل استایل سه بعدی و قشنگ تری به عناصر بوت استرپ میده و باید حواستون باشه بعد از فایل اصلی بوت استرپ لود بشه.
خودتون یک دکمه اضافه کنید و یک بار با قرار دادن لینک theme و یکبار هم بدون آن صفحه را تست کنید خودتون متوجه زیباییش میشید.
bootstrap right to left:
آقای مرتضی انصاری نیا در nuget زحمت کشیدن و بوت استرپ رو راست به چپ کردن که برای صفحات فارسی مناسب.
https://github.com/morteza
دریافت بوت استرپ راستچین شده
حجم: 24.3 کیلوبایت
