15 کتابخانه جالب JavaScript و CSS

گردآوری و تالیف : عرفان کاکایی
تاریخ انتشار : 14 شهریور 1397
دسته بندی ها : طراحی وب , css

باز هم با مجموعه‌ای از منابع منتخب در خدمت شما هستیم، که ارزش توجه شما را دارند. در این مقاله، با ۱۵ کتابخانه JavaScript و CSS آشنا خواهید شد.

Buefy

فریم‌وورک سبک رابط کاربری برای Vue.js، ساخته شده با استفاده از کتابخانه معروف CSS، یعنی Bulma. این فریم‌وورک تمام کتابخانه‌هایی که یک وب‌اپلیکیشن معمولی نیاز دارد را داراست. مانند عناصر دینامیک مثل modalها، toastها و اعلانات که توسعه دهندگان را قادر می‌سازند تا سریعا هر رابط کاربری‌ای را به پروژه Vue.js خود اضافه کنند.

HR.js

کتابخانه‌ای بدون نیاز به هیچ‌گونه Dependency، برای برجسته‌سازی و جایگزینی رشته‌ها داخل DOM. اِی‌پی‌آی HR.js نمی‌تواند از این ساده‌تر باشد. فقط یک از انتخاب‌کننده CSS برای هدف‌گیری عنصر HTML مادر که شامل متن مورد نظر است استفاده کنید، کلمه مورد نظر برای برجسته‌سازی را انتخاب کنید، رنگ پس زمینه را تنظیم کنید و کار شما به اتمام می‌رسد.

React VR

React VR فریم‌وورکی برای ساخت برنامه‌های واقعیت مجازی است که در مرورگر اجرا می‌شوند. این فریم‌وورک، APIهای مدرن مانند WebGL و WebVR را جفت می‌کند، و تجربه‌ای را می‌سازد که می‌تواند از طریق دستگاه‌های مختلفی جذب شود.

Tippy.js

کتابخانه خالص JavaScript برای tooltipهای پویانمایی شده. این کتابخانه محدوده بزرگی از افکت‌های on-hover و چندین قابلیت سفارشی‌سازی با بیش از 20 گزینه فراهم می‌کند. Tippy.js فوق سبک است و سازگاری خوبی با مرورگر دارد.

Barba.js

یک کتابخانه بدون هیچ‌ گونه Dependency برای JavaScript، برای ساخت transitionهای نرم میان viewهای برنامه تک صفحه‌ای شما. منطق آن بر پایه PJAX ساخته شده است که تمام URLهای معتبر را بررسی می‌کند، از رفتار طبیعی آن‌ها جلوگیری می‌کند و در عوض صفحه جدید را با استفاده از Push State API در URL برنامه شما بارگذاری می‌کند.

UIkit

یک فریم‌وورک frontend عالی برای CSS و JavaScrpt، شامل آیکون‌های SVG منحصر به فرد و تعداد زیادی کامپوننت. UIkit هم در ظاهر و هم به عنوان یک فریم‌وورک، به خوبی طراحی شده است. این فریم‌وورک دارای استایل‌های یکپارچه، API ساده، تعداد زیادی گزینه‌های سفارشی‌سازی، کلاس‌های تغییر دهنده پر کاربرد و... است.

Haul

Haul یک ابزار خط دستوری برای توسعه برنامه‌های React Native است. این ابزار می‌تواند به عنوان جایگزین مستقیم برای React Native packager استفاده شود، پشتیبانی بهتری برای Webpack فراهم می‌کند و پیغام‌های خطای پیشفرته‌تری دارد. Haul قابل سفارشی‌سازی و کاملا اوپن سورس است.

AcrossTabs

یک کتابخانه JavaScript برای ارتباط میان تب‌های مرورگر میان ریشه‌ای، که یک وب‌اپلیکیشن را قادر می‌سازد تا تب‌های اضافی برای یک مرورگر را باز و بسته کند. تب مادر به اطلاعات پرکاربردی درباره تب‌های فرزند، مانند idهای خاص دسترسی دارد؛ چه تب مربوطه هنوز باز باشد، یا چه بسته شده باشد.

Stylelint

Stylelint یک خطایاب CSS مدرن است که به شما کمک می‌کند استانداردهای CSS را در stylesheetهای خود پیاده‌سازی کنید. این کتابخانه بسیار قدرتمند بوده، و می‌تواند سینتکس‌های SCSS را تشخیص دهد. همچنین این کتابخانه کاملا قابل سفارشی‌سازی است.

Iconate

یک کتابخانه Vanilla JavaScript عالی که شما را قادر می‌سازد تا آیکون‌ها را با چندین انیمیشن نرم، تغییر شکل دهید. Iconate با تمام فونت‌های آیکون CSS کار می‌کند. فقط یک آیکون را به HTML خود اضافه کنید، و از API جاواسکریپت ساده آن استفاده کنید.

React-Datasheet

کامپوننت React که می‌تواند برای اضافه کردن datasheetهای Excel مانند به برنامه استفاده شود. سلول‌های جدول می‌توانند به راحتی ویرایش شوند، به صورت گروهی انتخاب شوند، کپی شوند، پیست شوند، حذف شوند و هر کار دیگری که می‌خواهید را با آن‌ها انجام دهید.

Pure CSS

یک فریم‌وورک ماژولار برای CSS. این کتابخانه پس از فشرده سازی به کلی 3.8 کیلوبایت حجم دارد، اما این مسئله به هیچ وجه بخش‌های مورد نیاز را از بین نبرده است. ماژول‌های آن شامل مجموعه پایه استایل‌ها، یک محیط پاسخگو، کامپوننت‌های فرم، دکمه‌ها، جداول و منوها است.

Simple Icons

مجموعه‌ای بزرگ از آیکون‌های رایگان برای شبکه‌های اجتماعی، برنامه‌ها، سرویس‌ها و... از آنجایی که تمام آیکون‌ها با استفاده از SVG ساخته شده‌اند، می‌توانند بدون افت کیفیت به هر سایزی تبدیل شوند. این ویژگی همچنین آن‌ها را بسیار سبک می‌کند. اکثر آن‌ها زیر ۵۰۰ بایت، و موارد جزئیات پردازی شده ۱ یا ۲ کیلوبایت حجم دارند.

Chroma.js

کتابخانه JavaScript کوچک برای کار با رنگ‌ها. این کتابخانه یک API غنی با بیش از 50 تابع برای دستکاری رنگ‌ها فراهم کرده است، که شما را قادر می‌سازد تا بین حالت‌های رنگ جا به جا شوید.

Weex

Wexx یک فریم‌وورک مشابه به React Native برای ساخت برنامه‌های موبایل میان پلتفرمی است. این فریم‌وورک شما را قادر می‌سازد تا برنامه خود را در HTML، CSS و JavaScript بنویسید، که بعدا برای اندروید به Java، و برای IOS به Swift رندر می‌شود. این فریم‌وورک چندین کامپوننت، API و دیگر ابزار پرکاربرد داخلی دارد.

منبع

مقالات پیشنهادی

15 کتابخانه جالب javascript و css

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

15 کتابخانه جالب javascript و css دی ۹۵

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

15 کتابخانه جالب javascript و css بهمن ۹۵

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

15 کتابخانه جالب javascript و css فروردین ۹۶

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