بعد از مشاهده دوره Bootstrap ۵ نیاز هست که شما دوستان عزیز Bootstrap ۵ را در دنیای واقعی مشاهده کنید. به این معنی که شما در قالب 4 پروژه (landing page,langing page with sass, coming soon, admin panel) بخش های مختلف قالب ها را یادبگیرید تا هر سایتی که مد نظرتون هست را بتونید به راحتی با Bootstrap ایجاد کنید.
بخش های مانند : نمایش هدر با اسکرول، layout بوت استرپ، ایجاد انیمیشن در اسکرول، شخصی سازی بوت استرپ با sass، تغییر اسلایدر بوت استرپ، حالت darkmode، شمارنده، افزودن map و chart به پروژه، deploy (آپلود پروژه در سرور) و ....
هدف از این دوره یادگیری بخش های مختلف در قالب های مختلف هست.
حتما ویدیو معرفی دوره را مشاهده کنید تا با پروژه های که توی این دوره ایجاد میشه آشنا بشید.
پیش نیاز های این دوره فوق العاده کاربردی:
برای ارسال نظر ابتدا باید وارد سایت شوید
سلام
عرض ادب
استاد توی ویدئوی معرفی دوره توی پروژه آخر که پنل مدیریت رو پیاده سازی کردید، در واقع تماما ساخت ظاهر هستش و هیچ ارتباطی با بکند نویسی نداره دیگه؟!
منتها ظاهری هستش که صرفا برای مدیر سایت پیاده سازی میشه و سمت client نیستش. درسته دیدگاهم؟
انگار یه فرانت هستش برای بکند :))
سلام وقت بخیر.
ببینید ما نیاز به یک پنل داریم که بتونیم فرضا محصول کم و زیاد کنیم تا توی سایت اصلی مشتری ببینه حالا این پنل که یک پروژه جدا هست، هم فرانت و بک اند داره
دوره درمورد بوت استرپ هست که فریمورکی برای فرانت هست، پس قالب ما فقط فرانت هست و برای بک اند نیاز هست دوره های بک اند را مشاهده کنید.
سلام خدمت استاد و دوستان رمز فایل ها چی هست
سلام وقت بخیر.
فایل های تمرینی رمز ندارند.
سلام استاد خسته نباشید چجوری فایل های aos رو بدون اینکه به اینترنت وصل باشیم تو فایلمون فراخوانی کنیم
سلام وقت بخیر.
شما میتوانید محتوای فایل ها (زمانیکه لینکشون را توی مرورگر باز میکنید) را کپی و در یک فایل ذخیره و به پروژه اضافه کنید.
وقت شما هم بخیر میشه لطفا با مثال بهم توضیح بدید .من یک پروژه دستمه که اصلا به اینترنت وصلش نمیکنن برای همین میخواستم تمام فایل هایی که شما cdn شو قرار میدید بدون اینترنت ازش بشه استفاده کرد
ببینید شما دوتا cdn از aos به پروژه اضافه میکنید که یکیش css هست و دیگری js. اگه آدرس یا مسیر این cdn ها را توی مرورگر باز کنید سورس کدش را بر میگرده، حالا شما میتوانید مثلا سورس کد css را کپی و یک فایل css ایجاد و پیست کنید و حالا اون فایل را به پروژه اضافه کنید مانند افزودن فایل css به پروژه
توی پیش نیاز های این دوره هم گفته شده، پیش نیاز دوره ها خیلی مهم هستند.
سلام استاد من برای شروع از این دوره شروع کنم یا از دوره آموزش بوت استرپ 5
سلام وقت بخیر.
برای شروع چی؟
در کل توی ویدیو و توضیحات هر دوره، پیش نیاز های آن گفته شده
همچنین میتوانید از چارت آموزشی هم استفاده کنید.
چه دوره عالی.. و همچنین پشتیبانی عالی که استاد مشکل دانشجوهارو حل میکنه همه چی عالی..
استاد دوره (alpine.js) رو چیزی دربارش نمیدونم و اینکه تو توضیحاتش گفتین برای فریمورک لاراول هست. یعنی یجورای با php هم باید سروکار بزنیم؟ چون اصلا نمیخوام برم سمت php هدف بعدیم سمت بک اند جنگو هست
ممنون از سایتتون از همه جهات عالی هست
سلام وقت بخیر.
ممنون از شما و حمایتتون
خیر ما نگفته ایم که alpine برای لاراول هست، بلکه یک فریمورک برای جاوااسکریپت و در سمت کلاینت هست.
یکبار دیگه ویدیو معرفی و قسمت های ابتدای دوره را که بصورت رایگان هست را مشاهده کنید.
سلام استاد وقت بخیر
من tooltip و popover که میزارم در بوت استرپ 5 کار نمیکنه ممنون میشم این کد رو نگاه کنید مشکلش کجاست کلافه شدم حتی popper هم اسکریپتدهی کردم به سند
ممنون از وقتی که میزارین
"<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>index</title>
<link href="https://fonts.googleapis.com/css2?family=Material+Icons" rel="stylesheet">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
<link rel="stylesheet" href="./style.css">
</head>
<body>
<div class="container mt-5">
<div class="row">
<div class="col">
<button type="button" class="btn btn-secondary" data-bs-toggle="popover" data-bs-placement="bottom" data-bs-content="Bottom popover" data-bs-container="body">Popover on bottom</button>
<button type="button" class="btn btn-secondary" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Tooltip on bottom">Tooltip on bottom</button>
</div>
</div>
</div>
<script src="./production_jquery_3.6.js"></script>
<script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.10.2/dist/umd/popper.min.js" integrity="sha384-7+zCNj/IqJ95wo16oMtfsKbZ9ccEh31eOz1HGyDuCQ6wgnyJNSYdrPa03rtR1zdB" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.min.js" integrity="sha384-QJHtvGhmr9XOIpI6YVutG+2QOK9T+ZnN4kzFN1RtK3zEFEIsxhlmWl5/YESvpZ13" crossorigin="anonymous"></script>
<script src="./js.js"></script>
</body>
</html>" سلام وقت بخیر.
چرا فایل css برای بوت استرپ 4 هست، فایل js مربوط به ورژن 5 بوت استرپ ؟
این سوال مربوط به چه قسمت و دوره ای هست؟ لطف کنید سوالاتتون را زیر قسمت مربوطه بپرسید و کد هاتون را بین سه عدد بک تیک قرار بدید و ارسال کنید.
سلام متوجه شدم ممنون
سلام .
استاد بدونه Alpin.js هم میشه این دوره رو نگا کرد یا باید حتما یادش بگیریم؟
سلام وقت بخیر.
اگه ویدیو معرفی دوره را ببینید توضیحات داده شده، این دوره تمرکزش روی بوت استرپ هست و بخش های جاوااسکریپت را با هر چیزی که اوکی هستید میتونید پیاده سازی کنید ما توی دوره از alpine.js استفاده کردیم. پیش نیاز های دوره هم مهم هستند.
سلام وقت بخیر
برای اینکه وقتی اینپوت از نوع نامبر میزاریم اون فلشها رو نشون نده انتهای اینپوت باید چکار کنیم
"<input type="number" class="form-control" placeholder="قیمت محصول را بنویسید..." required>"
و اینکه من نمیدونم در Vscode چه هات کی رو میزنم سهوا که فاصیله میفته بین اول و آخر ایدی و کلاس ها و کلا داخل تگ ها مثل تگ زیر میشه ببینید همه تگهای سند html من اینجوری فاصله میفته بینش مثل فاصله " با modal بعد در js که میگیرم چون اینجا همش فاصله داره کار نمیکنه
"<" div class=" modal fade " id=" city-choose-modal ">"
ممنون میشم راهنمایی کنید این دو تا سوال رو
سلام وقت بخیر.
برای سوال اول میتوانید از این استایل استفاده کنید
/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
-webkit-appearance: none;
margin: 0;
}
/* Firefox */
input[type=number] {
-moz-appearance: textfield;
}ممنون استاد لطف کردین فقط یه سوال دیگه بپرسم برای اینکه از کاربر عکس بگیریم باید اینپوت تایپ image بزاریم یا file چون با تایپ file عکس میگیریم src میشه fake path/ و نمیتونیم عکسی که کاربر مثلا در فرم آپلود کرده رو نشون بدیم چون ادرسش c:/fakepath شده چه دستوری میفرمایید بتونم حلش کنم
برای این موضوع باید از جاوااسکریپت استفاده کنید که اگه با js آشنا باشید کافیه سرچ کنید.
سلام استاد وقتتون بخیر ببخشید من یه پروژه دارم که وقتی اجرا میشه نباید به اینترنت دسترسی داشته باشه چطوری میتونم alpine رو به پروژم اضافه کنم با دستور npm ?
دوم اینکه کجا باید دستور import 'alpinejs' رو بنویسم ؟ ممنون میشم راهنمائیم کنین
سلام وقت بخیر.
ببینید شما میتونید کد های alpine.js را توی یک فایل ذخیره و مثله بقیه فایل ها اضافه کنید از طریق npm هم میتونید، که نیاز هست دوره آلپاین و پیش نیازهاش را مشاهده کنید.
سلام وقت بخیر د رپروژه دوم این دوره من همبرگر نوبارم کار نکرد حتی با ادرس دهی زیر
<script src=" ./node_modules/bootstrap/dist/js/bootstrap.bundle.min.js "></script>
سلام وقت بخیر.
آیا پوشه node_modules را دارید توی پروژه ؟
دستور npm i را وارد کردید که پکیج های مور نیاز نصب بشه ، که در عمل این پکیج ها توی پوشه node_modules هستند.
سلام مجدد بله دقیقا ولی نه collapse ها در اکاردیون و نه همبرگر کار نمیکنه و جلبه در جی کویری هم که دستوری رو مینویسم روی متلا click و ready و... که مینویسم یه خط میکشه
الان در همین تدرس هم نود ماژول هست نوشتم ببینیدش
در صورت امکان، سورس کدتون را از طریق تلگرام وب پروگ ارسال کنید تا بررسی بشه
آیا منظورتون از
npm i
همان
nom init هست؟
چون من به ترتیب برا ی کار با sass طبق ویدئو شمادستورات زیر رو در ترمینال وارد میکنم
npm init -y
npm install bootstrap
npm install node-sass
تغییر متغیر در packaje json
و د رآخر
npm run sass
خیر این دستور میاد پکیج ها را باتوجه به فایل packaje.json نصب میکنه، در مورد npm توی دوره خودش صحبت شده و پیش نیاز این بخش از دوره هست که توی توضیحات و ویدیو معرفی گفته شده، اما خب خیلی از دوستان پیش نیاز ها براشون مهم نیست. به هر حال همانطور که عرض شد اگه مشکلی دارید، سورس کد را توی تلگرام ارسال کنید تا بررسی بشه
سلام استاد وقت بخیر
یک سوال داشتم استاد من tailwind رو از دوره شما یادگرفتم و خیلی برای من راحت شده استفاده از اون به لطف شما. من استاد backend فعالیت می کنم laravel به نظر شما tailwind کافی هست یا اینکه این 2 دوره bootstrap شما رو تهیه و کامل یاد بگیرم ؟
ممنون
سلام وقت بخیر.
اوکی هست، اما با توجه به اینکه با tailwind آشنا هستید، یادگیری بوت استرپ براتون سخت نیست و میتونید دوره رایگان را مشاهده کنید.
سلام
مبحث css animation در اين دوره استفاده ميشه و بايد دوره جداگانه اون رو تهيه كنيم يا براي animation و transition از كتابخانه ها استفاده ميشه؟
تشكر
سلام وقت بخیر.
هر دوره مبحث جداگانه خودش را داره و ممکنه توی یک دوره دیگه استفاده بشه یا نشه، به عنوان مثال دوره انیمیشن css برای دوستانی هست که قصد یادگیریش را داشته باشند و توی پروژه های خودشون استفاده کنند. توی این دوره ما فقط انیمیشن در اسکرول را استفاده کردیم که اونم پکیج هست.
ممنون
پس براي اين دوره و پروژه هاش إلزامي نيست دوره animation در css شما رو ببينيم و از پكيج استفاده شده براي animation و transition پروژه ها ؟
خیر الزامی نیست. توی توضیحات دوره، توی پیش نیاز ها برای دوره انیمیشن نوشته شده که بصورت اختیاری هست.
سلام بنده در یادگیری جاوا اسکریپت مشکل دارم و بعضی مفاهیمش رو اصلا درک نمی‌کنم
چگونه این مشکل را رفع کنم؟
سلام وقت بخیر.
شما باید قسمت ها را به دقت ببینید و بعد از هر قسمت تست کنید و همچنین اون مطلب را میتونید بصورت فارسی سرچ و مقالات فارسی را مطالعه کنید.
سلام استاد وقت بخیر و خسته نباشید.
جسارتا استاد دوتا موضوع:
یک اینکه برای بوت استرپ دنیای واقعی اول بریم (جاوااسکریپت)و(اون فریمورکشو)یاد بگیریم بعد بیایم دنیای واقعیو ببینیم؟
دو اینکه این دنیای واقعی 4-5 قسمتش مونده برای تکمیل کامل میشه؟
ممنون
سلام وقت بخیر.
برای سوال اول، جاوااسکریپت جز جدا ناپذیر از فرانت هست و به نظر بنده حتما یادبگیرید.
سوال دوم، بله قسمت های آخر دوره هست.
سلام بابت آموزش هاتون خیلی ممنون . ببخشید امکانش هست یک ویدیو آموزشی هم قرار بدهید که سایت چه موقع آماده آپلود روی هاست است ؟؟
سلام وقت بخیر.
قسمت آخر این دوره درمورد deploy یا آپلود پروژه روی سرور صحبت میکنم.در کل شما هر زمان که دوست داشته باشید یا تغییراتی روی پروژه انجام دادید و میدانید که نیاز هست آپلود کنید، میتونید روی سرور پروژه را قرار بدید.
سلام
استاد برای قسمت پروژه این دوره که فرمودید آلپاین یا فرمورک دیگه ای نیاز هست یاد بگیریم، آیا با بلد بودن خود جاوااسکریپت هم میشه به خوبی درک کرد آموزش های این دوره رو؟
بنده دوره جاوااسکریپت خود شما رو دو بار کامل دیدم،نیاز هست حتما آلپاین رو هم ببینم قبل از این دوره؟
سلام وقت بخیر.
ببیند توی معرفی دوره هم گفته شده، این دوره بوت استرپ هست که فریمورک css هست و برای بخش های جاوااسکریپت شما از خوده js یا کتابخانه ها و فریمورک هاش میتونید استفاده کنید، حالا کار کردن با آلپاین بسیار ساده هست و ما هم از اون استفاده کردیم.
سلام
با توجه به اينكه گفته ميشه سينتكس alpine شبيه به vue هست با ديدن اين دوره ميشه كدهاي جاوااسكريپتي كه شما با alpine مينويسيد رو به همون شكل با vue پياده سازي كرد؟
سلام وقت بخیر.
ببینید روند کاریشون فرق داره، شما یک مسئله دارید که له روش های مختلف و زبان یا فریمورک مختلف میتونید حل کنید، مهم منطق برنامه هست
سلام وقت بخیر
توی معرفی دوره گفتین از جاوااسکریپت استفاده کردید یعنی حتما باید بلد بود تا کامل بشه این پروزه هایی ک میزنید رو درک کرد یا با همون جاوااسکریپت های بوت استرپ میشه کامل همین هارو زد؟
سلام وقت بخیر.
بله نیاز هست با جاوااسکریپت به خوبی آشنا باشید، بوت استرپ فریمورک css هست.
سلام
در اين دوره ميشه با vue قسمت هاي جاوااسكريپتش رو شبيه پروژه ها نوشت يا كلاً متفاوت هستن و فقط بايد براي پروژه هاي اين دوره آلپاين يادگرفت؟
سلام وقت بخیر
بله میشه اما vue برای وبسایت های spa مناسب هست.بخش جاوااسکریپتی اختیاری هست و شما میتوتید با خوده js یا jquery و یا کتابخانه و فریمورک های دیگه میتوتید بزنید، خواهش میکنم ویدیو معرفی را ببینید، توضیحات داده شده است.
sanazsalehi
سلام استاد پروژه های دیگه ای که با scss نوشته شده چطور بیاریم بالا
علی شیخ
6 ماه پیش
سلام وقت بخیر.
اگه نیاز به تغییر باشه، تغییر میدید و کامپایل میکنید. توی دوره sass در موردش صحبت شده