ایجاد کننده اسکریپت درج والد و فرزند در پایگاه داده MySQL

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

برای استفاده‌ی آنلاین از این ابزار، اینجا کلیک کنید

ارسال شده در HTML, نرم‌افزار | برچسب‌شده , , , | دیدگاه‌تان را بنویسید

هفت نکته‌ی مهم SEO در سال ۲۰۱۵

سئو ۲۰۱۵

همزمان با سپری شدن زمان، الگوریتم‌های رتبه‌بندی سایت‌ها توسط موتورهای جستجو نیز در حال تحول و بهبود مداوم هستند، انجام SEO یا بهینه‌سازی موتورهای جستجو، نیز نیازمند فرآیندهای متفاوتی نسبت به گذشته است.
آنچه در ادامه مشاهده می‌کنید، فهرستی از آخرین روش‌های بهبود SEO در سال ۲۰۱۵ هستند.

ادامه‌ی خواندن

ارسال شده در SEO | برچسب‌شده , , | دیدگاه‌تان را بنویسید

اعتبارسنجی فیلدهای متنی برای حروف فارسی با استفاده از jQuery

همان گونه که می‌دانید، اعتبارسنجی عبارت‌های واردشده توسط کاربر باید در سمت سرور به انجام برسند، با این حال برای بهبود تجربه‌ی کاربری ممکن است بخواهیم اعتبارسنجی ورودی‌های کاربر را علاوه بر سمت سرور، در سمت مشتری نیز به انجام برسانیم.
در قطعه کد دنباله، روشی ساده برای اعتبارسنجی فیلدهای input از نوع text یا هر نوع متنی دیگر برای ورود حروف فارسی ارائه می‌شود:

$( 'body' ).on( 'keypress', 'input.persian', function( e ) {
	// backspace, delete, tab, escape, enter
	if ( $.inArray(e.keyCode, [ 46, 8, 9, 27, 13 ]) !== -1 ||
		 // Ctrl+A
		( ( e.charCode == 65 || e.charCode == 97 ) && e.ctrlKey === true ) || 
		 // home, end, left, right
		( e.keyCode >= 35 && e.keyCode <= 39 ) ) {
			 return;
	}
 
	if ( -1 == $.inArray( String.fromCharCode( e.charCode ), ['‌', ' ', 'آ','ا','ب','پ','ت','ث','ج','چ','ح','خ','د','ذ','ر','ز','ژ','س','ش','ص','ض','ط','ظ','ع','غ','ف','ق','ک','گ','ل','م','ن','و','ه','ی','ي','ك','ة'] ) ) {
		e.preventDefault();
	}
 
} );

برای استفاده از این قطعه کد، می‌بایست آن را در ابتدا یا انتهای فایل html خود فراخوانی کنید.
پس از فراخوانی این کد، تمامی inputهایی که صفت class آن‌ها مقدار persian را داشته باشد، به صورت خودکار ارزیابی می‌شوند.

<input class="persian" name="fname" type="text" />
<input class="persian" name="lname" type="text" />

این تابع به صورت delegate تعریف شده است. بنابراین تمامی فیلدهای متنی که پیش از اجرای دستور یا پس از آن ایجاد شوند، ارزیابی می‌شوند.
به علت تعریف این قطعه کد به صورت delegate، کارایی این روش بسیار بالا است و در تعداد زیاد input هم اثر اندکی روی کارایی سایت ایجاد خواهد کرد.

ارسال شده در جاوااسکریپت, عمومی | برچسب‌شده , , , , | یک دیدگاه

آشنایی با Zepto.js به عنوان جایگزینی برای jQuery

Zepto.js یک کتابخانه‌ی سمت مرورگر است که می‌تواند در برخی کاربردها جایگزین مناسبی برای jQuery باشد. مهم‌ترین ویژگی Zepto، سازگاری ساختار این کتابخانه با جی‌کوئری است. به این معنی که چنانچه شیوه‌ی کدنویسی با jQuery را بدانید، شیوه‌ی کدنویسی Zepto را نیز فرا گرفته‌اید.

فلسفه‌ی Zepto

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

ارسال شده در برنامه‌نویسی, جاوااسکریپت | برچسب‌شده , | دیدگاه‌تان را بنویسید

رویدادهای delegate در جی‌کوئری

رویدادها یا eventهای delegate رویدادهایی هستند که به عنصرهای اصلی متصل نمی‌شوند. برای مثال چنانچه یک جدول با ۱۰۰ ردیف و ۱۰ ستون داشته باشیم، و بخواهیم زمان کلیک شدن روی یک سلول از این موضوع با خبر شویم، با پیوست کردن رویداد click به عنصر table می‌توانیم از وقوع کلیک روی هر سلول باخبر شویم.

علت عملکرد رویدادهای delegate این است که اغلب مرورگرها، رویدادها را به صورت درختی منتشر می‌کنند. یعنی در هنگام کلیک روی یک عنصر td، عنصرهای tr، tbody، table و body به ترتیب از این رویداد مطلع خواهند شد.

دو سناریو برای استفاده از رویدادهای delegate به جای پیوست کردن رویدادها به تک‌تک عنصرها وجود دارد.

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

سناریوی دوم زمانی است که تعداد عنصرهای هدف بسیار زیاد باشند و استفاده از رویدادهای delegate در این شرایط برای افزایش کارایی صورت می‌پذیرد. یک رویداد delegate در مقایسه با صدها و هزاران رویداد عادی می‌تواند اثر بزرگی در کارکرد نرم‌افزار ما به ویژه در مرورگرهای محدود مانند مرورگرهای موبایل به همراه داشته باشد.

استفاده از رویدادهای delegate در نگارش‌های مختلف jQuery به شیوه‌های مختلفی انجام می‌شود. قدیمی‌ترین روش که اکنون منسوخ شده است استفاده از دستور live است. این تابع، به صورت ضمنی، رویدادها را به عنصر body متصل می‌کند و بر اساس selector مشخص شده، رویدادهای مربوط به عنصر دلخواه شما را به تابع هدف هدایت می‌کند.

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

در آخرین نگارش‌های jQuery پیوست کردن رویدادهای delegate همانند رویدادهای معمولی با استفاده از دستور on به انجام می‌رسد.

// jQuery.on( events [, selector ] [, data ], handler );
jQuery( 'table' ).on( 'click', 'td', tdClicked );
 
function tdClicked( evt ) {
	alert( $( this ).text() );
}

همان‌گونه که در مثال بالا مشاهده می‌کنید، رویداد تنها یک‌بار به عنصر table پیوست می‌شود ولی با هر کلیک روی عنصرهای داخلی از نوع td، رویداد به صورت delegate فراخوانی و متغیر this نیز به عنصر درونی اشاره خواهد کرد.

به یک شیوه‌ی دیگر نیز می‌توان به صورت ضمنی همین عملکرد را در اختیار داشت. در این روش، فیلتر کردن عنصرها به صورت دستی انجام می‌شود و با توجه به delegate نبودن رویداد، دسترسی به عنصر داخلی با استفاده از event.target به جای this ممکن خواهد بود:

jQuery( 'table' ).on( 'click', tableClicked );
 
function tableClicked( evt ) {
	if ( evt.target.nodeName == 'TD' ) {
		alert( $( evt.target ).text() );
	}
}
ارسال شده در برنامه‌نویسی, جاوااسکریپت | برچسب‌شده | ۲ دیدگاه

doT.js یک Template Engine سریع در جاوااسکریپت

استفاده از Templateها در محیط‌های مختلف و زبان‌های مختلف بسیار متداول است. یک Template یا قالب، ساختاری است که در ایجاد محتوای جدید و تکراری به برنامه‌نویسان یاری می‌رساند.
Templateها با اهداف مختلفی توسعه پیدا می‌کنند. در زبان جاوااسکریپت هم ابزارهای مختلفی برای استفاده از Tempaleها ایجاد شده‌اند که یکی از بهترین موارد آن doT.js نام دارد.
در این نوشته به اختصار روش نصب و استفاده از این کتابخانه را بررسی خواهیم کرد.
ادامه‌ی خواندن

ارسال شده در HTML, برنامه‌نویسی, جاوااسکریپت | برچسب‌شده , , | دیدگاه‌تان را بنویسید

بهینه‌سازی حجم فایل‌های PNG

یکی از فرمت‌های تصویر قابل استفاده در مرورگرهای اینترنتی PNG است. بسیاری از ابزارهای گرافیکی مانند فتوشاپ توانایی ذخیره‌سازی فایل‌های PNG را در خود دارند ولی با توجه به محدودیت زمانی و گاهی فنی، این فایل‌ها را تا بیشترین اندازه‌ی خود فشرده نمی‌کنند. با توجه به اهمیت حجم در سایت‌های اینترنتی، ابزارهای جانبی مختلفی برای بهینه‌سازی فایل‌های PNG توسعه پیدا کرده‌اند.
یکی از ابزارهای موجود که به شما کمک می‌کند حجم فایل‌های PNG را بیش از پیش کاهش دهید OptiPNG است. برای استفاده از این برنامه ابتدا بسته‌ی zip آن را دانلود کنید و محتویاتش استخراج کنید.
سپس فایلی متنی با با نام compress.cmd در کنار فایل اجرایی برنامه ایجاد کنید و قطعه کد زیر را درون آن قرار دهید.

optipng -nx -o7 -strip all %1

برای فشرده‌کردن فایل‌های PNG کافی‌است با کمک ماوس آن‌ها را روی فایل compress.cmd بکشید و رها کنید. توجه کنید که فایل اصلی شما فشرده خواهد شد و اگر به فایل اصلی نیاز دارید ابتدا یک کپی از آن تهیه کنید.
در فرمت PNG برای پیش‌پردازش و فشرده‌سازی می‌توان از روش‌های مختلفی بهره‌گیری کرد. دستور بالا تمامی روش‌های موجود را بررسی می‌کند و با بهترین تنظیمات ممکن فایل شما را بهینه‌سازی می‌کند.
با مطالعه‌ی راهنمای همراه بسته می‌توانید تنظیمات را به دلخواه خودتان تغییر دهید.

۶ آبان ۱۳۹۱
فشرده‌سازی فایل‌های png با کمک نرم‌افزار PngOptimizer

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

۵ آذر ۱۳۹۳
در جستجوهایی که انجام دادم با یک کتابخانه‌ی جدید به نام pngquant آشنا شدم. ویژگی قابل توجه این کتابخانه نسبت به دو روش قبلی این است که فایل‌های بهینه‌سازی شده با این ابزار، می‌توانند به صورت مجزا تصویر را به صورت ۲۵۶ رنگ و شفافیت تصویر را نیز با استفاده از ۸ بیت نگهداری کنند.
در حالت معمول، بیشتر نرم‌افزارهای گرافیکی از جمله فتوشاپ، امکان ذخیره‌سازی تصاویر شفاف را در این حالت فراهم نمی‌کنند و ناچار هستید که به جای استفاده از ۸ بیت برای تصویر، از ۲۴ بیت فضا استفاده کنید در نتیجه، حجم فایل‌های ذخیره شده با نرم‌افزارهایی مثل فتوشاپ به طور متوسط دو برابر خروجی pngquant خواهد بود.
برای استفاده از pngquant روش‌های مختلفی وجود دارد. برای به‌کارگیری این کتابخانه در ویندوز، نرم‌افزار PNGoo توسعه پیدا کرده که می‌توانید آن را از سایت اصلی دریافت کنید.
بدیهی است که به دلیل کاهش تعداد رنگ‌های مورد استفاده، کیفیت خروجی pngquant ممکن است اندکی از خروجی فتوشاپ کمتر باشد که معمولا در بیشتر مواقع با چشم قابل مشاهده نیست.
برای مشاهده‌ی وبسایت pngquant و دریافت نرم‌افزارهای آن اینجا کلیک کنید

ارسال شده در فناوری | برچسب‌شده , | دیدگاه‌تان را بنویسید

ایجاد فیلد‌های محاسبه شده در مدل‌های Laravel

در هنگام استفاده از اطلاعات ذخیره شده در پایگاه داده، ممکن است برخی از داده‌ها پیش از استفاده نیاز به پردازش یا محاسبات خاص داشته باشند.
برای مثال ممکن است بخواهیم نام کامل فرد که ترکیبی از «عنوان فرد»، «نام کوچک» و «نام خانوادگی» است در اختیار داشته باشیم.
یا ممکن است تاریخ تولد یک فرد را که به صورت میلادی در پایگاه داده ذخیره شده، به صورت شمسی دریافت کنیم.
یا ممکن است بخواهیم URL یک فایل را که تنها نام آن در بانک اطلاعاتی نگهداری می‌شود را به دست آوریم.
در تمامی موارد بالا و موارد مشابه، فیلدهای محاسباتی یکی از بهترین روش‌ها برای دستیابی به هدف هستند.
پیاده‌سازی فیلدهای محاسباتی در Eloquent به سادگی امکان‌پذیر است.

برای این منظور کافی است تا به ازای هر فیلد، یک تابع با پیشوند get و پسوند Attribute درون مدل ایجاد کنیم. نام فیلد محاسباتی جدید نیز باید به صورت CamelCase میان پیشوند و پسوند قرار بگیرد. برای نمونه یک فیلد محاسباتی با نام full_name به صورت زیر تعریف می‌گردد:

<?php
public function getFullNameAttribute() {
	return "{$this->title} {$this->fname} {$this->lname}";
}
?>

با تعریف این تابع جدید، دسترسی به نام کامل کاربر به شکل زیر ممکن خواهد بود:

<?php
echo $user->full_name;
?>

لاراول به صورت پیش‌فرض محاسبه‌ی مقدار این فیلد را به صورت Lazy Load به انجام می‌رساند و چنانچه بخواهید مجموعه‌ای از رکوردها را به صورت آرایه یا JSON ایجاد کنید، دسترسی به مقدار این فیلد ناممکن خواهد بود.

برای اینکه Eloquent مقدار این فیلد جدید را به همراه آرایه‌ها و JSON، محاسبه کند، می‌بایست داخل مدل این دستور را به صورت صریح درج کنید.

<?php
protected $appends = array( 'full_name' );
?>

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

ارسال شده در برنامه‌نویسی, عمومی, لاراول, پایگاه داده | برچسب‌شده , , | دیدگاه‌تان را بنویسید

با پیدا شدن اشکال امنیتی جدی، SSL 3.0 به پایان خود رسید

دو روز گذشته( ۲۳ مهر ۱۳۹۳ ) گروهی از کارشناسان گوگل اشکالی امنیتی در پروتکل امنیتی SSL 3.0 پیدا کردند که باعث می‌شود افراد مهاجم بتوانند اطلاعات کدشده میان سرور و مرورگر را بخوانند.
این اشکال امنیتی Poodle نام گرفته و برای رفع آن هیچ راه حلی به جز غیرفعال کردن SSL 3.0 روی مرورگر وجود ندارد.
موزیلا اعلام کرد که در نگارش ۳۵ فایرفاکس این پروتکل را به طور کلی غیرفعال خواهد کرد. گوگل نیز اعلام کرد برنامه دارد تا این پروتکل را در آینده‌ای نزدیک از کروم حذف کند.
از دید فنی، مهاجمینی که در شبکه‌ی داخلی شما باشند، می‌توانند با انجام تغییراتی در درخواست‌های ارسال شده و ارسال درخواست‌های مکرر بعدی، اطلاعات حساسی مانند cookieهای مرورگر شما را کشف کنند.
مطابق بررسی‌های مشترک موزیلا و دانشگاه میشیگان، با غیرفعال کردن SSL 3.0 حدود ۰.۳ درصد سرورهای موجود در اینترنت همچنان از این پروتکل که توسعه‌ی آن به دو دهه‌ی گذشته برمی‌گردد وابسته هستند و غیرفعال کردن SSL 3.0 سبب می‌شود دسترسی به این سرورها غیرممکن شود.
از طرف دیگر، تنها مرورگری که از نگارش‌های جدیدتر پروتکل امنیتی به نام TLS پشتیبانی نمی‌کند، Internet Explorer 6.0 است.

راه حل موقتی

در حال حاضر به شیوه‌های مختلف می‌توانید استفاده از این پروتکل را در مرورگر خود غیرفعال کنید.
موزیلا یک افزونه‌ی جدید را منتشر کرده که شما را در انجام این کار یاری می‌رساند.
گوگل کروم نیز با دستور خط فرمان ‎–ssl-version-min=tls1 پشتیبانی از SSL 3.0 را غیرفعال می‌کند.

برای کسب اطلاعات بیشتر از پیوندهای زیر استفاده کنید
وبلاگ امنیتی گوگل
وبلاگ موزیلا

ارسال شده در امنیت | برچسب‌شده , , | دیدگاه‌تان را بنویسید

AngularJS چیست؟

AngularJS

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

با استفاده از AngularJS می‌توان در یک صفحه‌ی وب، چندین Application مجزا از هم ایجاد کرد که هر یک به پایگاه داده‌ای مجزا متصل می‌شوند و اطلاعات را ارسال و دریافت می‌کنند.

استفاده از این کتابخانه بسیار آسان است. کافی است صفت‌های متناسب را به تگ‌های HTML اضافه کنید و در انتها، فایل اسکریپت AngularJS را در صفحه درج کنید تا بقیه‌ی کارها به صورت اتوماتیک به انجام برسد.

نخستین گام ایجاد یک Application جدید است که با مقداردهی به صفت «ng-app» شدنی است:

<div ng-app>
</div>

هر تگ حاوی صفت «ng-app» حاوی یک Application است. برای سازگاری با HTML5 می‌توانید صفت‌های AngularJS را که با پیشوند ng‌ آغاز می‌شوند با پیشوند data-ng آغاز کنید

پیوند دادن اطلاعات ورودی و خروجی

<div data-ng-app>
	<label>نام:</label>
	<input type="text" data-ng-model="yourName" placeholder="نام خود را وارد کنید">
	<p>سلام {{yourName}}!</p>
</div>

پس از تعریف فیلدهای ورودی و خروجی، کافی است تا فایل اسکریپت AngularJS را در سرآمد یا انتهای فایل HTML بارگزاری کنیم:

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0-rc.4/angular.min.js"></script>

همان طور که گفته شد، AngularJS امکانات بسیار زیادی دارد که می‌تواند توسعه‌ی ابزارهای تحت وب را آسان و سریع‌تر کند. در این نوشته تنها به آشنایی سریع با این کتابخانه پرداختیم. برای کسب اطلاعات بیشتر می‌توانید از پیوندهای زیر استفاده کنید:
سایت رسمی
راهنمای استفاده از AngularJS در W3schools

ارسال شده در HTML, جاوااسکریپت | برچسب‌شده , | ۳ دیدگاه