پانزده کتابخانه‌ی JavaScript و CSS جذاب برای اردیبهشت ماه 1397

پانزده کتابخانه‌ی JavaScript و CSS جذاب برای اردیبهشت ماه ۱۳۹۷

هدف ما در گردآوری مجموعه‌هایی اینچنینی این است که شما همواره به‌روز باشید و با آخرین و جذاب‌ترین گرایش‌های توسعه‌ی وب آشنا شوید. به همین دلیل در هر ماه چیزی شبیه به این مجموعه را منتشر می‌کنیم. سعی کردیم که بهترین منابع را گردآوری کنیم و انتظار داریم که مورد توجه شما نیز قرار گیرند.

با کلیک بر روی عنوان هر یک از کتابخانه‌هایی که در ذیل می‌آید، می‌توانید سایت آن را مشاهده کرده و اطلاعات بیشتر در مورد آنها کسب کنید.


Text Mask

Text Mask

این یک کتابخانه‌ی جاوااسکریپت برای ایجاد انواع مختلفی از mask روی فیلدهای ورودی فرم است. بسیار سبک است (حجمی کمتر از ۴ کیلوبایت دارد)، هیچگونه وابستگی به کتابخانه یا اسکریپت‌های دیگر ندارد و با استفاده از افزونه‌ها قابل توسعه است. اضافه کردن mask به یک فیلد ورودی می‌تواند کاربران را راهنمایی کند که داده‌ای که می‌خواهند وارد کنند به چه شکلی باید باشد. مثلا در مورد ایمیل، شماره تلفن، اطلاعات کارت اعتباری و خیلی داده‌های دیگر.


 

Toast UI Calendar

Toast UI Calendar

یک تقویم جذاب با کاربری آسان که راهی موثر برای مدیریت زمان‌بندی کارهای شما را ارائه می‌دهد. انواع گوناگونی از نحوه‌ی نمایش (روزانه، هفتگی، ماهانه و …) را پشتیبانی می‌کند و امکان نمایش هشدارهای popup هنگامی که زمان یک کار فرا می‌رسد را به شما می‌دهد. برای سادگی بیشتر، قابلیت کشیدن (dragging) و تغییر اندازه (resizing) برای انجام فعالیت زمان‌بندی فراهم است. می‌توانید روز اول هفته را به دلخواه تغییر دهید. همچنین با استفاده از قالب‌ها می‌توانید شخصی‌سازی لازم برای ظاهر آن را انجام دهید.


 

Length.js

Length.js

با استفاده از این کتابخانه قادر خواهید بود که واحدهای اندازه‌گیری طول را به یکدیگر تبدیل کنید. هم در Node.js و هم در مرورگر کار می‌کند. در unpkg CDN به صورت فشرده شده و غیر فشرده در دسترس است. علاوه بر اینکه می‌توانید یک واحد را به واحد دیگر تبدیل کنید، یک قابلیت جذاب این کتابخانه این است که می‌توانید اندازه‌ها در واحدهای مختلف را با یکدیگر جمع کنید. از واحدهای اندازه‌گیری همچون متر، فوت، اینچ، یارد، مایل و خیلی واحدهای دیگر پشتیبانی می‌کند.


 

Day.js

Day.js

یک کتابخانه‌ی کوچک، سریع و بدون تغییر برای آنالیز (parsing)، اعتبارسنجی (validating) و شکل‌دهی (formatting) تاریخ است. کار کردن با API آن ساده است. به خوبی روی تمام مرورگرها کار می‌کند و می‌تواند جایگزین مناسبی برای Moment.js باشد. با استفاده از این کتابخانه می‌توانید تاریخ‌ها را در فرمت‌های متنوعی ایجاد کنید، آن‌ها را با هم جمع یا از هم کم کنید، با یکدیگر مقایسه کنید و همچنین فرمت آنها را تغییر دهید.


Mustard UI

Mustard UI

Mustard یک قالب کاری (framework) متن باز و سبک برای CSS است. تمام کامپوننت‌هایی که یک قالب کاری سمت کاربر (front-end) به آنها احتیاج دارد، پشتیبانی می‌کند. به عنوان مثال: CSS flexbox grid, progress bars, buttons, forms و خیلی چیزهای بیشتر. در حال حاضر در نسخه‌ی beta است و در آینده خیلی بیشتر بهبود پیدا می‌کند.

Mustard در لغت به معنای “خردل” است.


Next.js

Next.js

این یک قالب کاری سبک برای ساختن برنامه‌های ایستا (static) و برنامه‌هایی که سمت سرور تفسیر می‌شوند (server-rendered) با استفاده ار جاوااسکریپت و React است. برای اینکه صفحات سریعتر بارگذاری شوند به صورت خودکار code splitting را ارائه می‌دهد. مسیردهی ساده‌ای در سمت کاربر دارد. به صورت توکار (built-in) از CSS پشتیبانی می‌کند. با موبایل سازگار است. با استفاده از پلاگین‌ها می‌توانید آن را شخصی‌سازی کنید.


Permit

Permit

Permit یک کتابخانه‌ی احراز هویت (authentication) برای API های Node.js است. با استفاده از آن می‌توانید به سادگی یک لایه‌ی احراز هویت به API های Node.js خود اضافه کنید. این کتابخانه می‌تواند با سایر قالب‌های کاری معمول نظیر Express، Koa و Hapi مورد استفاده قرار بگیرد. Permit واسط ساده‌ای دارد که کمک می‌کند منطق احراز هویت به سادگی نوشته شود.


 

The Serverless Framework

The Serverless Framework

مجموعه ابزاری برای توسعه‌ی معماری‌های بدون سرور است. این امکان را به شما می‌دهد که با اطمینان، توابع، رویدادها و منابع مورد نیاز آنها را از طریق مدیران ارائه دهنده‌ی منابع (provider resource managers) توسعه دهید. زبان‌های Node.js، Python، Jave، PHP و خیلی زبان‌های برنامه‌نویسی دیگر را پشتیبانی می‌کند. این قالب کاری کاملا قابل توسعه دادن است و شما می‌توانید از پلاگین‌هایی که دیگران ساخته‌اند استفاده کنید و یا حتی خودتان ایجاد کنید.


 

Pico.js

Pico.js

یک کتابخانه‌ی متن باز جاوااسکریپت برای تشخیص چهره (face detection) است. حقیقتا سبک است و در حالت کوچک شده، تنها ۲ کیلوبایت حجم دارد. و توانایی تشخیص بلادرنگ (real time) با ۲۰۰+ FPS را دارد. شما می‌توانید این نمونه را که از وب‌کم کامپیوتر یا تلفن شما استفاده می‌کند، بررسی و مشاهده کنید.

پیشنهاد می‌کنم حتما این کتابخانه‌ی فوق‌العاده را بررسی کنید.


 

VuePress

VuePress

VuePress یک سازنده‌ی سایت ایستاست. برای هر صفحه یک HTML ثابت پیش پردازش‌شده ایجاد می‌کند و آن‌ها را همچون یک برنامه‌ی تک صفحه‌ای (single-page) اجرا می‌کند. این کتابخانه دارای یک قالب پیش‌فرض است که طرح‌بندی واکنشگرا دارد، نوار راهنما و نوار کناری آن قابلیت شخصی‌سازی دارد و صفحه‌ی اصلی و خیلی چیزهای دیگر قابل انتخاب به دلخواه هستند.


Preact

Preact

Preact یک جایگزین حداقلی برای React است که بازده‌ای عالی و API مدرنی دارد. یکی از سریعترین کتابخانه‌های Virtual DOM است. ویژگی‌هایی برای بهبود راندمان دارد که از آن جمله می‌توان به قابلیت به‌روزرسانی دسته‌ای قابل شخصی‌سازی (customizable update batching)، تفسیر غیرهمزمان اختیاری (optional async rendering) و DOM recycling اشاره کرد. به شدت انعطاف‌پذیر و قابل توسعه است و با اضافه کردن نام مستعار preact-compat شما می‌توانید از کامپوننت‌های گوناگون React در برنامه‌ی خود استفاده کنید.


 

Particle Effects for Buttons

Particle Effects for Buttons

یک کتابخانه‌ی کوچک که می‌تواند برای ایجاد جلوه‌ی بصری انفجار یا پراکنده شدن ذرات استفاده شود. این افکت روی دکمه‌ها عالی به نظر می‌رسد و آنها را به تکه‌های ریز تبدیل می‌کند. برای ایجاد انیمیشن‌ها از anime.js استفاده شده است و شما می‌توانید بازه‌ی رمانی، سرعت، نوع، شمایل و ویژگی‌های دیگر آنها را تغییر دهید.


 

Load Asset

Load Asset

یک کتابخانه‌ی ساده بر مبنای promise است که فایل‌های تک یا چندتایی را به صورت موازی بارگذاری می‌کند. تصاویر (png, jpg, svg)، فایل صوتی (mp3, ogg)، فایل ویدئویی (mp4)، فایل json، متنی و دیگر انواع فایل را پشتیبانی می‌کند. می‌تواند با ترکیب async/await استفاده شود و همچنین روی تمام مرورگر ها شامل IE +11 کار می‌کند.


 

CSS Loader

CSS Loader

این یک کتابخانه‌ی ساده برای ایجاد افکت‌های جذاب بارگذاری (loading) است که تنها با CSS نوشته شده است. انواع مختلفی دارد که می‌توانید از میان آنها انتخاب کنید. استفاده از آنها واقعا ساده است. فقط به یک المان div در HTML احتیاج دارید و بعد باید چند کلاس به آن اضافه کنید. همین!


 

Sails

Sails

Sails یک قالب کاریست که راه ساده‌ای برای ساختن برنامه‌ی Node.js دلخواه ارائه می‌کند. از معماری MVC تبعیت می‌کند که در قالب‌های کاری همچون Ryby on Rails استفاده شده است. قابلیت تولید REST APIs به صورت خودکار دارد. یک WebSocket ساده به صورت یکپارچه دارد. با هر پایگاه داده‌ای کار می‌کند. با تمام قالب‌های کاری سمت کاربر سازگاری دارد.


 

منبع: ۱۵Interesting JavaScript and CSS Libraries for May 2018
ترجمه: سیدمحمدحسین طباطبایی بالا

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *