نرم افزارهای مورد نیاز برای شروع کار با بوت استرپ

برای اینکه این آموزش را شروع کنیم، شما عزیزان به نرم افزارهای زیر نیاز دارید:

visual studio code  ادیتور رایگان و قدرتمند ویژوال استودیو کد دانلود از سایت رسمی

مرورگر به روز فایر فاکس یا گوگل کروم

افزونه های ویژوال استودیو کد (که به مرور حین آموزش نحوه نصب پلاگین ها را توضیح خواهم داد) دانلود افزونه های ویژوال استودیو کد

ایجاد پروژه

در این آموزش قصد داریم با استفاده از بوت استرپ و به صورت پروژه محور طراحی یک قالب فروشگاه اینترنتی  را آموزش دهیم.

در ابتدا یک پوشه با نام store1 ایجاد می کنیم و داخل آن، پوشه هایی با نام های css, js, images  و fonts  می سازیم.

سپس همانند تصویر زیر با کلیک راست بر روی فضای خالی داخل پوشه store1 گزینه open with Code را انتخاب می کنیم.


آموزش پروژه محور بوت استرپ به زبان فارسی

در محیط vs code طبق تصویر زیر، صفحه اصلی فروشگاه به نام index.html را ایجاد می کنیم


آموزش پروژه محور بوت استرپ به زبان فارسی

دریافت بوت استرپ

برای استفاده از بوت استرپ ما از روش دانلود بوت استرپ به جای  CDN استفاده می کنیم، به همین منظور به آدرس get.bootstrap.com رفته و بوت استرپ کامپایل شده را دانلود می کنیم

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

سپس، با توجه به شکل زیر در بخش Compiled CSS and JS گزینه دانلود را نتخاب می کنیم

آموزش بوت استرپ

فایل فشرده دریافتی را از حالت فشرده خارج کرده و محتویات پوشه های css و js را درون پوشه هایی که از قبل ساختیم کپی می کنیم.

امیدوارم که ازاین آموزش هم راضی باشید، در بخش بعد استفاده عملی از بوت استرپ  در یک پروژه عملی را آموزش خواهیم داد.