چرتک بلاگ

سلام دوستان! امیدوارم هرجایی که هستین شاد و سلامت باشین :) پس از مدت‌ها امروز تونستم ابزار آزمون‌ساز تمام CSS بدون نیاز به جاوا اسکریپت رو تکمیل و به صورت متن باز منتشرش کنم.

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

ساخت آزمون به کمک ابزار

{نمونه خروجی این ابزار}

کافیه به این لینک برین و اطلاعاتی که لازم هست رو وارد کنین. روی سوال رو کافیه در قسمت title و پاسخ‌های مربوطه رو در قسمت option وارد کنین و گزینه صحیح رو هم از اونجا انتخاب کنین. در صورتیکه خواستین گزینه جدیدی اضافه کنین میتونین add option رو بزنین و یا برای حذفش از گزینه delete استفاده کنین. برای سوالاتم همین منوال هستش و چیز پیچیده‌ای نیست. قسمت Description برای این هست توضیحات اضافی در مورد جواب سوال بدین و این مورد زمانیکه کاربر گزینه‌ای رو انتخاب کرد نمایش داده میشه.

اگر سوالاتتون به صورت فارسی هستن میتونین گزینه right to left رو فعال کنین تا خروجی به صورت راست به چپ و زبان فارسی باشه. در غیر اینصورت سوالات و پاسخ ها به صورت چپ به راست و زبان انگلیسی خواهد بود.

قسمت custom css برای این هستش که اگر از ظاهر آزمون خوشتون نیومد کد سفارشی سازی شدتون رو این قسمت وارد کنین.

و در نهایت با زدن دکمه Code میتونین کد html مربوط به آزمون رو کپی کنین و توی یک پستی در وبلاگ منتشرش کنین.

دکمه save و clear saved برای ذخیره آزمون توی مرورگر شماست و میتونین با زدن این دکمه آزمون رو ذخیره کنین تا بعدا آزمون رو ویرایش کنین یا اگر اشتباهی مرورگرتون رو بستین زحمتتون بر باد نره.

دکمه Data هم کل سوالات رو در قالب JSON به شما میده. تو آینده امکان اینکه آزمون رو به وسیله این Data لود کنیم رو هم قرار میدم تا بتونین اطلاعات رو توی جایی ذخیره کنین.

چطور از کد توی وبلاگ استفاده کنیم؟

کافیه که توی بلاگ بیان به قسمت انتشار - ارسال مطلب جدید برین و با توجه به ویرایشگری که استفاده میکنین دکمه مربوط به منبع (source code) رو بزنین. در ویرایشگر پیشفرض دکمه به این شکل هستش:  بعد کدی که ابزار بهتون داده رو در اینجا paste میکنین و باز همون دکمه منبع رو میزنین تا به حالت ویرایشگر برگردین. همین :) پست رو انتشار کنین و تمام.

اگرم قصد دارین قبل آزمون یک چیزی بنویسین بهتره اول متنتون رو بنویسین و بعدش دکمه منبع رو بزنین و به آخر برین (دکمه end توی کیبرد برای این کار به درد میخوره) و کد رو اونجا پیست کنین.

شرایط استفاده و آپدیت ابزار

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

لینک گیتهاب و مابقی حرفا

اگر خواستین میتونین سورس ابزار رو از لینک زیر ببینین و اگر هم که پروژه رو star کنین خیلی خوشحالم کردین! نمیدونم دقیقا چیه و به چه دردی میخوره ولی میخوامش :))

لینک ابزار آزمون ساز در گیتهاب

ایده این ابزار رو من از خیلی وقت پیش داشتم. تقریبا یک یا دو سال پیش هم یکی از معلمین عزیز توی بلاگ بیان به من یک نمونش رو داده بودن تا مشکلش رو حل کنم ولی با توجه به تجربه‌ای که توی ابزار اسلایدرساز داشتم میدونستم همون قسمت UI و گرفتن اطلاعات قراره برام دردسر بشه :) بخاطر همین نگهش داشتم تا زمانیکه React.js رو یاد گرفتم رو این پروژه هم کار کنم و از این بابت واقعا خوشحالم چون اگر منطق React رو بلد باشین کدتون بسیار منظم‌تر و منطقی‌تر هستش و لازم نیست خودتون رو با DOM به فنا بدین! بعلاوه منطق و ظاهر برنامه هم تا حدودی از هم جدا هستن. بعدا نظر خودمو به صورت کامل در مورد React میگم و علت اینکه به همچین کتابخانه‌هایی نیاز داریم رو هم میگم.

خلاصه تنبلی بنده و یادگیری React و پروژه‌های دانشگاه و درسا باعث شدن که در نهایت دیروز این پروژه رو تموم کنم. پروژه دانشگاهیمون رو هم بعدا قرار میدم چون واقعا ازش لذت بردم.

یک برنامه دیکشنری {عکس صفحه اصلی} و یک برنامه دفترچه تلفن {عکس صفحه اصلی} هستش که البته دومی ناقصه و امکاناتی که قولشو دادیم رو نتونستیم کامل پیاده کنیم (ارسال پیامک و گروه بندی و این چیزا. شماره‌های مربوط به دفترچه تلفن هم به صورت رندم ساخته شدن به مردم زنگ نزنین!) از زبان جاوا و JavaFX استفاده کردیم.

علت اینکه واقعا این پروژه رو دوست داشتم اینه چون توی JavaFX میشه از چیزی مشابه CSS استفاده کرد بخاطر همین یک طراحی کاملا اختصاصی داره. و البته کدنویسیشم منظمه تا حد امکان سعی کردم با شی‌گرایی و جدا نوشتن هر قسمت از برنامه هم تعداد کد رو کاهش بدم و هم هوشمندانه‌تر پیادش کنم. جدا از اینکه کلا پروژه نمره داشت واقعا تجربه خوبی بود.

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

و اینکه این پست و ابزار رو تماما توی linux mint نوشتم! قبلا ubuntu داشتم ولی دکمه و پنجره‌هاش خیلی بزرگ بودن و سنگینم بود بخاطر همین تصمیم گرفتم mint رو امتحان کنم. واقعا هم سرعتش خوبه هم از ظاهرش راضیم :) ویندوز بخاطر کارهای اخیرم سرعتش بهتر شده ولی باز اصلا قابل قیاس با mint نیستش. خلاصه اگر گوشه اتاقتون یک سیستم درب و داغون قاجاری دارین و میخواین یک کاری باهاش انجام بدین ایده خوبیه که یک توزیع لینوکسی سبک رو روش امتحان کنین. بعدا در مورد لینوکس و افزایش سرعت ویندوز هم مینویسم.

خلاصه هم حرف زیاده برای گفتن و هم مطلب زیاده برای نوشتن. سعی میکنم اینجا بیام و بیشتر بنویسم چون بیشتر از هر چیزی خودم لذت میبرم.

همین دیگه حرف دیگه‌ای نیستش... تا پست بعدی شاد و سلامت باشین!