آموزش جامع Alpine.js: یادگیری Alpine.js با 10 پروژه جذاب - آخرین آپدیت

سرفصل ها و درس ها

مقدمه Introduction

• مقدمه Introduction

• منابع دوره Course Assets

• راه اندازی و آماده سازی اولیه - ویرایشگر، افزونه ها، مرورگر Basic Setup & Preparations - Editor, Plugins, Browser

مفاهیم Alpine Alpine Concepts

• x-data: مقداردهی اولیه Alpine JS و x-text x-data : Initializing Alpine JS & x-text

• x-show و x-on x-show & x-on

• x-model x-model

• x-bind x-bind

• میانبرهای x-bind و x-on x-bind & x-on shortcuts

• بیایید آنچه تاکنون آموخته ایم را مرور کنیم Let's review what we have learnt so far

• x-show در مقابل x-if x-show vs x-if

• x-ref و $refs x-ref & $refs

• حلقه زدن در alpine: x-for Looping in alpine: x-for

• x-text در مقابل x-html x-text vs x-html

• انیمیشن در alpine: x-transition Animation in alpine: x-transition

• استفاده از x-transition با کلاس های CSS Using x-transition with CSS classes

• x-cloak x-cloak

10 پروژه جذاب Alpine JS برای تمرین 10 Cool Alpine JS Projects for Practice

• مقدمه بخش - پروژه های جذاب Section introduction - the cool projects

• بیایید راهنمای ابزار ساده ایجاد کنیم Let's create simple tooltips

• نوار/منوی ناوبری واکنشگرا برای هدر وب سایت Responsive navigation bar / menu for website header

• زبانه ها با Alpine JS Tabs with alpine js

• ایجاد یک تایمر شمارش معکوس جذاب Create a cool countdown timer

• آکاردئون با انیمیشن روان Accordion with smooth animation

• استفاده از API: ایجاد یک مولد نقل قول Using API: Create a quote generator

• تغییر دهنده تم: سوئیچ حالت روشن/تاریک Theme Switcher: Light/Dark mode switch

• مودال Alpine.js Alpine.js modal

• یک چرخ فلک ساده A simple carousel

• بیایید یک برنامه لیست انجام باحال برای تفریح ​​ایجاد کنیم - نشانه گذاری و استایل Let's create a cool todo app for fun - markup and styling

• بیایید یک برنامه لیست انجام باحال برای تفریح ​​ایجاد کنیم - کاربردی کردن آن Let's create a cool todo app for fun - making it functional