افزودن جادو به وبسایت با کتابخانه GSAP ✨

یکی از کتابخانه های قدرتمند جاوااسکریپتی برای استفاده از انیمیشن در صفحات HTML، کتابخانه GSAP هست.

این کتابخانه قابلیت ایجاد انیمیشن برای هر المانی در صفحه، مثل div ها و svg ها رو داره. از ویژگی های GSAP که اونو نسبت به سایر کتابخانه های جاوااسکریپتی قدرتمند تر می‌کنه میشه به موارد زیر اشاره کرد⬇️

1️⃣ سادگی و راحتی در استفاده

2️⃣ سرعت و کیفیت اجرای بالا

3️⃣حجم بسیار کم کتابخانه

4️⃣ وجود افزونه های متنوع برای کارهای مختلف

5️⃣ مستندهای خوب و جامع

6️⃣ وجود مثال و نمونه کد های فراوان

7️⃣ جامعه کاربری (community) خوب


برای استفاده از این کتابخانه در پروژه خود میتونید از یکی از روش‌های زیر استفاده کنید⬇️

🔵 استفاده از CDN
🔵 نصب توسط npm (یا yarn)

برای اتصال کتابخانه به پروژه خودتون با استفاده از cdn، میتونید از کد زیر استفاده کنید

<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.2.6/gsap.min.js"> 
</script>

برای نصب این کتابخانه با استفاده از npm هم میتونید دستور زیر و در ترمیتال پروژه خود وارد کنید

npm install gsap

بدون شک GSAP یکی از قدرتمندترین کتابخانه های جاوااسکریپتی موجود برای استفاده از انیمیشن در صفحات html هست. برای آشنایی بیشتر با این کتابخانه بهتون پیشنهاد میکنم به داکیومنت این کتابخانه مراجعه کنید.

Document 🌐

#animation #gsap
@CodeModule

انیمیشن های جادویی با Framer Motion⏬

کتابخانه Framer Motion، یک کتابخانه جاوااسکریپتی برای ایجاد انیمیشن‌های تعاملی در وب هست. این کتابخانه به دولوپرا اجازه میده تا به راحتی، انیمیشن‌ها و ترکیبات حرکتی مختلف رو به وبسایت‌ها و پروژه های خودشون اضافه کنن. از جمله ویژگی‌های مهم این کتابخانه علاوه بر سادگی، پشتیبانی از چندین پلتفرم مختلف مانند وب، React Native و محیط‌های دیگر هست. Framer Motion از یک سینتکس داخلی تمیز و اجزای React بهره می‌بره که این کتابخانه رو بک انتخاب مناسب برای توسعه دهندگان React می‌کنه.

کتابخانه Framer Motion دارای ویژگی‌های متعددیه که امکان ایجاد انیمیشن‌های پویا و جذاب و برای دولوپرا فراهم می‌کنه.

برخی از ویژگی های Framer Motion ⬇️

🔵سادگی

🔵ترکیبات حرکتی پیشرفته

🔵 پشتیبانی از چندین پلتفرم

🔵انیمیشن‌های چند بعدی


این تنها چند ویژگی از کتابخانه Framer Motion هست که اونو به یکی از ابزارهای محبوب برای توسعه انیمیشن در وب تبدیل کرده.
پیشنهاد میکنم حتما یه سر به داکیومنت این کتابخانه بزنید⚡️


Document 🌐

#animation #framer_motion

بک گراند های جذاب با Particle.js 🔥

با استفاده از کتابخانه Particle.js، میتونید بک گراند های متحرک و تعاملی ایجاد کنید.

همچنین بک گراند های این کتابخانه قابلیت کاستوم شدن داره و شما میتونید، اشکال و با سایز و رنگ های مختلف برای هر قسمت از سایتتون که خواستید ست کنید.

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


Document 🌐

#partcleJs #animation
@CodeModule