Kaptain Kitty
انتشار :۱۶ دی ۱۳۹۵
بازدید :175 بار

DevTools Timeline Viewer

این یک ابزار رسمی از تیم ChromeDev Tools می باشد که به شما این امکان را می دهد تا URL ها را به راحتی برای رهگیری تایم لاین DevTool های خود نمایش داده و به اشتراک گذاری کنید.

ابزار DevTools Timeline Viewer

ابزار DevTools Timeline Viewer

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

پس از اینکه مقداری از داده های تایم لاین را به دست آوردید (یا از طریق refresh کردن صفحه در زمان باز بودن تایم لاین و یا با کلیک بر روی “Record” و تعامل با صفحه)، داده ها و گرافیک ها را با جزئیات بر روی آنچه که به دست آوردید مشاهده خواهید کرد.

وقتی بر روی تایم لاین راست کلیک می کنید، متوجه خواهید شد که گزینه هایی برای “Load Timeline data” و “Save Timeline data” وجود دارد. گزینه ی save، داده های JSON را به صورت فایل JSON ایجاد می کند و در این صورت می توانید آن داده را در Dropbox، GitHub Gist یا گوگل درایو ذخیره کنید، بنابراین می توانید داده ها را با دیگران به اشتراک بگذارید. می توانید به راحتی داده های تایم لاین را به همکاران و افرادی که دورکاری می کنند به اشتراک بگذارید.

Notification Logger

این ابزار به سادگی نامش می باشد. اگر شما هر مقدار JavaScript debugging انجام دهید، به احتمال زیاد از پیام های console.log استفاده می کنید. این مفیدتر از استفاده از alert() آزاردهنده است، اما هنوز هم خیلی وقت گیر است که هر بار می خواهید یک log ساده انجام دهید، مجبورید کنسول را باز کنید.

ابزار Notification Logger

ابزار Notification Logger

 

Notification logger پیام های console.log شما را با استفاده از Notification API به ناتیفیکیشن های دسکتاپی تبدیل می کند. پس از اینکه آن را با logger.init آغاز کنید، می توانید پیام ها را فقط از طریق ناتیفیکیشن های دسکتاپی log کرده و یا به صورت هم زمان از طریق دسکتاپ و کنسول. سپس می توانید با فراخوانی logger.destroy به کارایی نرمال console.log بازگردید.

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

Intercooler.js

این مورد قابل توجه Hacker News بوده است و در مورد مفید و کارامد بودن آن بحث های زیادی انجام شده است. میتوان آن را اینگونه توصیف کرد، “Ajax دارای attribute” و بلافاصله توجه افرادی که سهولت استفاده از کتابخانه های مورد استفاده در HTML و نیازمند به جاوا اسکریپت های کمتر برایشان اهمیت دارد را جلب خواهد کرد.

کتابخانه ی Intercooler.js

کتابخانه ی Intercooler.js

این کتابخانه به وسیله ی ویژگی (attribute) از پیش تعریف شده ی ic-* کار می کند که شما به المان های HTML خود اضافه می کنید.

برای مثال شما می توانید از attribute های مانند ic-target و ic-get-from استفاده کنید تا یک UI همراستای click-to-edit ایجاد کنید. می توانید از ic-history-elt برای افزودن پشتیبانی URL/history استفاده کنید. از ic-prepend-from و ic-poll برای ایجاد یک UI برای pause/play استفاده کنید.

تنها ایراد در استفاده از این کتابخانه این است که این کتابخانه بر پایه ی jQuery می باشد. اما به نظر من این موضوع خیلی مهمی نیست چون برنامه نویسان هدف برای این نوع پروژه احتمالا مشابه با برنامه نویسانی هستند که از jQuery استفاده می کنند.

ابزار Intercooler به شما این امکان را می دهد که Ajax را به اپلیکیشن خود اضافه کنید بدون اینکه مجبور به بازنویسی چیزی شوید و به خوبی با تکنولوژی back-end یا هر فریم ورک جاوا اسکریپتی دیگر کار می کند.

قسمت های اول و سوم را می توانید از طریق لینک های زیر مطالعه کنید:

ابزار های front-end جالب در سال ۲۰۱۶ – قسمت اول

ابزار های front-end جالب در سال ۲۰۱۶ – قسمت سوم

Ajax DevTools Timeline Viewer jQuery Postcss-grid-kiss آژاکس آموزش فریم ورک جاوااسکریپت ابزار Notification Logger اپلیکیشن ایمیل ساز MJML پلاگین Modaal جاوااسکریپت طراحی responsive فریم ورک jquery فریم ورک جاوا اسکریپت فریم ورک چیست کتابخانه ی Intercooler.js
مطالب مرتبط

با پیشرفت HTML 5 و پدید آمدن چارچوب‌های مختلف JavaScript توسعه‌ی نرم افزار‌های تک صفحه ای تحت وب (Single Page Applications) محبوب شده است.
اخیرا مطالب خوبی در رابطه با AngularJS در وبسایت جاری منتشر شده است. KnockoutJS توسط Microsoft معرفی شد و در قالب پیشفرض پروژه‌های SPA قرار گرفت ، بنابراین احتمالا این سوال برای افرادی مطرح شده است که تفاوت بین KnockoutJS و AngularJS چیست ؟

۱۵ کتابخانه جالب javascript و css در دنیای برنامه نویسی front end

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

زامارین ( Xamarin ) یک شرکت نرم افزاری در شهر سان فرانسیسکوی ایالت کالیفرنیا است که متعلق به شرکت Microsoft می باشد. این شرکت در سال ۲۰۱۱ توسط مهندسانی تاسیس شد که خالق Mono، Mono for Android و MonoTouch هستند که کاربردهای میان پلتفرمی از زیرساخت زبان مشترک (CLI) و مشخصات زبان مشترک هستند (که اغلب Microsoft.NET نامیده می شود).

نظراتتان را برایمان بنویسید

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

مطالب ما تو این شبکه های اجتماعی هم پخش میشه