آموزش ساخت وب سایت های سریع با Hugo the Static Site Generator & Bootstrap 5 (مقدمه)
Build fast websites with Hugo the Static Site Generator & Bootstrap 5 (Introduction)
این دوره مقدمه ای بر تولید سایت استاتیک/طراحی وب استاتیک است.
شما یاد خواهید گرفت که از Hugo برای تولید سایت ایستا و از Bootstrap 5 برای سبک سازی آسان استفاده کنید.
تمام نرم افزارهایی که نیاز دارید رایگان است و همه آنها در درس 1 توضیح داده شده است.
شما نیازی به هیچ تجربه ای در زمینه تولید سایت ایستا، کدنویسی، HTML یا CSS ندارید، اما اگر تجربه ای داشته باشید، درس ها را سریعتر پشت سر خواهید گذاشت.
در حالی که درس‌ها بسیار کوتاه هستند، دوره مروری کلی از همه چیزهایی است که برای شروع کار با Hugo و Bootstrap نیاز دارید.
من استفاده از خط فرمان را به حداقل می‌رسانم تا بتوانید روی یادگیری Hugo و Bootstrap 5 تمرکز کنید. در صورت امکان از رابط‌های گرافیکی استفاده می‌شود.
پروژه این دوره در حال تولید یک وب سایت ساده است که با کلاس های کاربردی Bootstrap 5 CSS کدگذاری شده و با Hugo تولید می شود.
می توانید نمونه ای از پروژه تمام شده را مشاهده کنید.
کد دروس تکمیل شده را خواهید یافت - باید روی دکمه کد کلیک کنید و یک فایل فشرده برای شاخه انتخابی خود دانلود کنید (هر درس در یک شاخه است - برای کمک به ویدیوی دوم مراجعه کنید)
هنگامی که پروژه را به پایان رساندید، می توانید تصاویر صفحه وب سایت را برای بازخورد آپلود کنید. اگر گیر کردید می توانید یک فایل فشرده از پیشرفت خود آپلود کنید و من به کد شما نگاه خواهم کرد. بهترین مکان برای شروع کمک صفحه بحث است.
پیوندها به اسناد هر درس
درس 2
https://git-scm.com/download/
https://desktop.github.com/
درس 3
درس 4
درس 5
https://getbootstrap.com/docs/5.1/layout/grid/
https://getbootstrap.com/docs/5.1/layout/breakpoints/
https://getbootstrap.com/docs/5.1/utilities/spacing/
درس 6
https://getbootstrap.com/docs/5.0/layout/columns/
https://getbootstrap.com/docs/5.0/utilities/display/
درس 7
درس 8
https://getbootstrap.com/docs/5.0/components/navbar/
https://getbootstrap.com/docs/5.0/utilities/background/
درس 9
درس 11
https://gohugo.io/content-management/page-bundles/
https://gohugo.io/templates/pagination/
https://gohugo.io/content-management/summaries/
درس 12
https://gohugo.io/commands/hugo/
https://winscp.net/
درس ها Lessons
-
خلاصه Summary
-
پاورقی با سال کپی رایت خودکار Footer with automatic copyright year
-
یک صفحه واحد ایجاد کنید Create a single page
-
صفحه اصلی با شبکه، دکمه ها و طراحی واکنشگرا Homepage with grid, buttons and responsive design
-
پاداش - وظایف Hugo را با اسکریپت های NPM خودکار کنید Bonus - Automate Hugo tasks with NPM scripts
-
پروژه HUGO را در VS Code راه اندازی کنید Set up HUGO project in VS Code
-
وب سایت را بسازید و آپلود کنید Build and upload the website
-
بوت استرپ 5 را اضافه کنید Add Bootstrap 5
-
Bootstrap 5 Navbar با Hugo Bootstrap 5 Navbar with Hugo
-
پاداش - تقسیم فایل پیکربندی Bonus - Split config file
-
یک صفحه فهرست ایجاد کنید Create a list page
-
مقدمه Intro
-
شروع شدن Getting Started
-
بوت استرپ 5 کارت و تکرار (حلقه) با محدوده Bootstrap 5 Cards and Iteration (looping) with range
-
HUGO و نرم افزار مورد نیاز را نصب کنید Install HUGO and required software
-
صفحه اصلی را با بوت استرپ 5 سفارشی کنید Customise home page with Bootstrap 5
Skillshare (اسکیل شیر)
اسکیل‌شر یک پلتفرم آموزشی آنلاین است که به میلیون‌ها افراد در سراسر جهان امکان یادگیری مهارت‌های جدید را فراهم می‌کند. این پلتفرم با ارائه دوره‌های متنوع در زمینه‌هایی از جمله هنر و طراحی، فناوری، کسب و کار، و زندگی موفق، به کاربران خود این امکان را می‌دهد تا به صورت آنلاین به یادگیری بپردازند.
یکی از ویژگی‌های منحصر به فرد سکیل‌شر، ارائه دوره‌های تدریس شده توسط صاحبان مهارت‌ها و افراد موفق در زمینه‌های مختلف است. این امر باعث می‌شود که کاربران از تجربیات و دانش عملی افرادی که در حوزه‌های مورد نظرشان موفق عمل کرده‌اند، بهره‌مند شوند و بهترین اطلاعات را برای بهبود مهارت‌های خود دریافت کنند. به این ترتیب، سکیل‌شر نه تنها یک پلتفرم آموزشی است، بلکه یک جامعه آموزشی است که افراد را به اشتراک گذاری دانش و تجربیات تشویق می‌کند و به آنها کمک می‌کند تا در مسیر پیشرفت و موفقیت خود ادامه دهند.
https://donyad.com/d/35a7
Sean Emerson
توسعه دهنده وب و متخصص سایت استاتیک
نمایش نظرات