معرفی منابع تازه ویژه توسعه دهندگان وب – سری اول

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

CuteStrap

cutestrap

CuteStrap یک فریم ورک رابط کاربری بر اساس Sass بوده که با المان هایی مانند: انواع فرم , navigation و button ها -که بیشترین استفاده در طراحی وب را دارند- آمده است و به تنهایی برای طراحی و ساخت بعضی وبسایت ها کافیست. اگر با فریمورک های مشهوری مثل Bootstrap یا Foundation overwhelming آشنا هستید، CuteStrap میتواند جایگزین جذابی برایتان باشد!

 

HTML5Test

html5test

HTML5 Test ابزاری آنلاین برای تست وبسایت در مرورگرهای مختلف بوده که پشتیبانی امکانات HTML5 در آنها را بررسی می کند. به عبارت دیگر این سایت، ابزاری کارآمد برای عیب یابی و یا تست وب اپلیکیشن های مدرن است.

 

Browser Calories

browser-calories

Browser Calories افزونه ی جالبی برای کروم بوده که وزن همان صفحه ای که داخلش هستید را اندازه می گیرد! این افزونه با اسکن تصاویر و فایلهای بارگزاری شده در آن صفحه و ترکیب آنها، وزن کلی صفحه را نمایش می دهد. ابزاری کوچکی که برای بهینه کردن صفحات وب بسیار مفید است!

 

Weex

weex

Weex فریم ورکی از “علی بابا” برای ساخت اپلیکیشن های موبایل تنها با استفاده از CSS, HTML و JavaScript میباشد! این فریم ورک همراه CLI ,DevTools ,UI Components ,Modules عرضه شده که بیش از پیش طراحی و توسعه این اپلیکیشن ها را آسانتر و سریعتر خواهد ساخت.

Microsoft Web Framework (MWF)

getmwf

مایکروسافت نیز همانند “علی بابا” فریم ورکی برای طراحی وب عرضه کرده که در آن اجزای رابط کاربری براساس زبان طراحی مدرن مایکروسافت (Microsoft Modern Design Language) یعنی طراحی Clean ,Flat و Minimal تعریف شده اند. این فریم ورک درکنار این اجزا، راهنمایی برای انتخاب رنگ، تایپوگرافی و انیمیشن دارد که می تواند رقیب خوبی برای Material Design گوگل محسوب شود.

Vital

vital

Vital فریم ورکی با ظاهر بسیار خوشایند و مینیمال است که از مهمترین ویژگی های آن میتوان به سبکی، استفاده نکردن از JavaScript و بهرمندی از Rogue – یک SyntaxHighlighter برمبنای Ruby – اشاره کرد.

Fontea

fontea

Fontea یک افزونه ی بسیار سودمند و رایگان برای فتوشاپ است که با آن میتوان به سادگی، هزاران فونت گوگل را مدیریت کرد. همچنین شما میتوانید داخل فتوشاپ نام فونتی را جستجو کرده، پیش نمایش آنرا دیده و درنهایت مستقیما بر روی متن خود اعمال کنید!

Drizzle

drizzle

Drizzle ابزاریست که به شما امکان ساخت UI Pattern یا Style Guide را برای وبسایت خود میدهد! این ابزار چیزهایی مانند رنگ، استایل های ساده و یا طرحی برای اجزای مختلف صفحه را -به خوبی قطعه کدهای نوشته شده- تولید می کند. یک تولیدکننده ی Style Guide همانند Drizzle باعث میشود که همواره به سبک استایل دهی خود پایبند باشید.

InterCooler

intercooler

InterCooler یک کتابخانه جاوا اسکریپت است که با آن میتوان AJAX رو به سادگی افزودن Attributes به کدهای HTML به سایت دلخواه خود اضافه کرد! این کتابخانه با راهنمای مخصوص خود -که شامل مثال های متعددی است- آمده تا به یادگیری و استفاده آن سرعت بخشد.

Picla

picla

Picala یک افزونه ی جالب jQuery بوده که اطلاعات نوشته شده در alt تگ های img را مانند label بر روی تصاویر نمایش می دهد. همچنین این افزونه یکسری گزینه هایی برای تغییر استایل یا انیمیشن های خود در اختیارتان قرار میدهد تا تغییرات دلخواه خود را اعمال کنید. البته قبل از آن برای نصب Picala باید از Bower استفاده کنید.

IziModal

izimodal

در این قسمت یک افزونه ی jQuery برای نمایش popup داریم. IziModal گزینه های زیادی برای شخصی سازی خود دارد که از آنها تنها به نامبردن تغییر انیمیشن، متن و رنگ های خود اکتفا میکنیم. از آن گذشته این افزونه بسیار سبک و ریسپانسیو بوده و قابلیت Retina-Ready هم دارد.

MegaBoilerplate

megaboilerplate

به سایت MegaBoilerplate بربد و ابزارها و کتابخانه های(Node.js , HTML5, Vanilla JavaScript, و Electron) موردنیاز خود را انتخاب کنید. این سایت همه ی آنها را کامپایل کرده و بصورت zip برای دانلود قرار میدهد.

Howler

howler

اگر مایل به استفاده ی پلیر صوتی در سایت خود هستید، Howler یک کتابخانه ی جاوا اسکریپت بوده که امکان داشتن پلیر صوتی آنلاینی با Web Audio API را فراهم آورده است! Howler با مرورگرهای قدیمی نیز مانند IE9 مشکلی نداشته و کدک های صوتی بسیاری مانند WAV, MP3 و WEBM را پشتیبانی می کند. این کتابخانه دارای ویژگی های بسیاری بوده که مهمترین آنها ماژولار بودن و اجرا شدن بدون هیچ کتابخانه ی خارجی است.

SuperEmbed

superembedjs

SuperEmbed هم کتابخانه ی کوچکی از جاوا اسکریپت میباشد که با آن میتوان عناصر embed شده در صفحه را بدون تغییر نسبت اندازه آنها ریسپانسیو کرد! این کتابخانه بیشتر سایت هایی مانند VideoPress ,Vine ,Flicker ,Youtube و Dailymotion را پشتیبانی می کند. پیش نمایش آن را ببینید!

CleaveJS

cleave

CleaveJs یک کتابخانه جاوا اسکریپت عالی برای قالب دهی خودکار مقادیر وارد شده در فرم ها است. برای مثال میتونه علامت جداکننده ی هزارگان رو برای متغیر های مالی بصورت خودکاز وارد کنه یا وقتی که میخواین مثلا شماره حساب تو یه قسمت ورودی وارد کنین میاد بین هر چهار رقم یک space میزنه و از هم جداشون میکنه یا در جای دیگه بین عناصر تاریخ / میزاره. استفاده از این افزونه از راه های بالا بردن تجربه کاربری (UX) سایت محسوب میشود.

Flipping Typical

flatpickr

سایت FlippingTypical امکانی در اختیارتان قرار میدهد تا فونت های نصب شده روی سیستم خود را بر روی نوشته ی واحدی اعمال کنید. البته کسانی که از سیستم عامل MacOs بهره میبرند، استفاده از برنامه ی کاربردی FontBook را بدلیل راحتی و امکانات بیشتر توصیه میکنیم.

LightTable

light-table

LightTable یک IDE جدید بوده که ارزش یکبار امتحان کردن را دارد. توسعه ی این پروژه از kickstarter شروع شد و در آنجا از طرف Matt Mullenweg (بنیانگذار وردپرس) پشتیبانی شده و در نهایت بصورت متن باز در اختیار همگان قرار گرفت. اگر امکان دسترسی به یوتیوب را دارید، دیدن این ویدیو را شدیدا پیشنهاد میکنیم!

Compressor

compressor

Compressor ابزاری فوق العاده مفید برای کاهش و فشرده سازی حداکثری سایز فایل های تصویری بدون کاهش کیفیت ظاهری آن ها است. پشتیبانی آن از پسوندهای رایج تصویری مانند PNG , GIF ,JPG و SVG از دیگر مزیت های این سرویس آنلاین است.

Microsoft Site Scan

staticscan

Microsoft Site Scan ابزاری بسیار کاربردی از مایکروسافت برای بررسی وبسایت از جهت سازگاری با مرورگرها و چگونگی دسترسی آنها میباشد. این ابزار درنهایت گزارشی از هر آنچه که امکان خطای آنها وجود دارد و باید برای حل آن اقدام کرد میدهد که در انتهای آن نیز شیوه ی برطرف آنها وجود دارد.

Disable Blogging

disable-blogging

و در آخرین مورد افزونه ی کاربردی Disabled Blogging وردپرس را معرفی میکنیم. افزونه ای که همانند نامش باعث غیرفعال شدن قابلیت های بلاگ نویسی وردپرس مانند قسمت پست ها، نظرات و خوراک(feed) میشود. این افزونه در نگاه اول ممکن است زیاد کاربردی نباشد اما برای وبسایت های فروشگاهی یا انجمن ها قطعا یکی از سودمند ترین افزونه هاست.

پاسخ دهید

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