وجاء موقع : Digg Instant

تم في مكتبة الاسكندرية خلال الفترة بين 24-26 الاحتفال بيوم البرمجيات الحرة في مكتبة الاسكندرية عن طريق اقامة مجموعة من الندوات التي تهدف الي التعريف بنظام التشغيل Linux و مميزاتة و يمكنك التعرف اكثر عن الحدث من خلال هذا الملف

الحدث كان مميز بالفعل و مجموعة الندوات تتفاوت في المستوي بين المتقدم و المبتدئ

ذكرني الحدث بالكات سكوب الذي كنا نقوم بة في الجامعة من قبل

اليوم اقدم شرح لكيفية انشاء خدمة اختصار للروابط بالاعتماد علي PHP & MySQL بشكل بسيط جدا حتي يتمكن دمجها مع اي مشروع شخصي

ربما يكون الحديث متاخر عن خدمات اختصار الروابط لكني وجت هذا الكود ضمن مشاريعي السابقة الغير مكتملة اردت نشرة لعل يفيد احد

قبل البداء في الشرح احب اوضح رائي الشخصي في مواقع و خدمات اختصار الروابط بشكل عام, انا من المعترضين علي تلك الخدمات ان يكون هناك مزود خدمة منفصل عن الموقع الاساسي لان بعض هؤلاء في اتفاقة الاستخدام يتيح لنفسة صلاحيات وقف الخدمة في اي وقت ورفع المسؤلية عن فقدان الروابط و في تلك الحالة تصبح كمية الروابط الموجودة علي الانترنت ليس لها اهمية و غير مفيدة !! لذلك يجب علي كل موقع انشاء خدمتة الخاصة بة و هذا ما اتجهت لة المواقع الكبري مثل تويتر و جووجل بعد اعتماد تويتر علي خدمات خارجية

لن اطيل الحديث نبداء بسم الله

هذا المكود يعتمد علي انشاء كلمة مختصرة من 6 احرف و ارقام مختلطة ترمز الي رابط كبير جدا في الاصل وبالاعتماد علي مجموعة الحروف و الارقام abcdefghijklmnopqrstuvwxyz0123456789 يصبح لدبنا 36 حرف وقد حددنا المساحة ب 6 خانات اذا 36^6 = ما يزيد عن 2,000,000,000 اي يتيح اختصار اكثر من 2 مليار رابط

$listAlpha = ‘abcdefghijklmnopqrstuvwxyz0123456789′;
return str_shuffle(
substr(str_shuffle($listAlpha),0,6)
);

هذا الجزء من الكود مسؤل عن ارجاع 6 خانات من الاحرف و الارقام بشكل عشوائي لتوضيحة اكثر

دالة str_shuffle تاخد الارقام و الحروف و تعيد ترتيبها بشكل عشوائي ثم تاتي دالة substr و تاخد فقط 6 خانات منها ثم يتم اعادة ترتيبهم عشوائيا باستخدام str_shuffle لينتج ما يقارب 2syxv3 وهذا يعتبر الرابط المختصر

الاسكربت يقوم علي ارسال الرابط المراد تصغيرة الي دالة

function createShort($long){

$query = “SELECT `short`  FROM `url` WHERE `long` = ‘$long’”;
$result = mysql_query($query);
if (mysql_num_rows($result) > 0){
while ($row = mysql_fetch_array($result))
return “http://localhost/short/”.$row['short'];
}
else {
$short = ”;
do{
$short = generateShort();
$query = “SELECT `short`  FROM `url` WHERE `short` = ‘$short’”;
$result = mysql_query($query);
} while (mysql_num_rows($result) >0);

$query = “INSERT INTO `url` (`short`, `long`) VALUES (‘$short’, ‘$long’);”;
$result = mysql_query($query) or die (mysql_errno() . ‘ ‘ . mysql_error());

return “http://localhost/short/”.$short;
}

}

وهي تاخذ الرابط المراد تصغيرة ثم تقوم بالبحث في قاعدة البينات علية منعا لتكرار الروابط اذا كان مدرج من قبل تقوم باعاة الرابط المختصر

غير ذلك تستدعي الدالة التي شرحناها مسبقا التي تنتج رابط مختصر من 6 خانات

ثم يتم البحث بة في قاعدة البينات حتي لا يتواجد رابطيت لهم نفس الاختصار اذا كان موجود يعاد توليد اختصار جديد ثم البحث و هكذا حتي يصل الي رابط غير مكرر

ثم يتم ادراج الرابط الاصلي و المختصر في قاعدة البينات حتي يتم الاستدعاء منها فيما بعد, و ارسال الرابط المختصر للمستخدم

هذا الجزء كان مختص باختصار الروابط ماذا عن استعادة الرابط الاصلي

function getLong($short)
{
$query = “SELECT `long`  FROM `url` WHERE `short` = ‘$short’”;
$result = mysql_query($query);
if (mysql_num_rows($result) > 0){
while ($row = mysql_fetch_array($result))
return $row['long'];
}
else {
return false;
}
}

يتم استدعاء تلك الدالة لاستعادة الرابط الاصلي فهي تستقبل الجزء المختصر من الرابط و تبحث عن المقابل لة في قاعدة البينات

اذا وجد ترجع الرابط الاصلي

اذا لم يكن موجود تعيد رسالة خطاء للمستخدم عن ادخالة رابط غير موجود

ولاكن كيف يتم استقبال الروابط المختصرة

Options +FollowSymLinks
RewriteEngine On

RewriteCond %{SCRIPT_FILENAME} !-d
RewriteCond %{SCRIPT_FILENAME} !-f

RewriteRule ^(.*) ./long.php?short=$1 [L]

يتم اضافة هذا الجزء في ملف .htaccess وهو المختص باعادة تةجية الروابط التي تاتي علي الشكل

http://localhost/short/2syxv3 الي صفحة long.php حتي يتم استخراج الجزء المختصر والتعامل معة

اعتقد ان هذا كل ما في الامر لم انتهي بعد لكن اقدم الكود كامل علي صفحة مشاريعي في موقعي الشخصي

الكود ينقصة بعد الاشياء مثل اضافة التاكيد من الروابط المخدلة وما الي ذلك بالطبع الاسكربت بدون تصميم حتي يسهل علي الجميع تطويعة لما يريدوا
اتمني ان يكون قدم استفادة

الفكار تلك المواقع تخلط بين خدمة موقعين Digg و stumbleupon لمشاركة و تقيم المحتوي

تلك الخدمات العربية جيدة جدا و تخدم المستخدم في اكتشاف المحتوي الجيد العربي علي الانترنت و في بعض الاحيان في قضاء بعض اوقات الفراغ في اكتشاف والقراءة عن اشياء جديدة و مفيدة

1- ضربت

ضربت.كوم ليس موقع للمنتديات. ضربت.كوم هو موقع إخباري إجتماعي ووسيلة لحفظ الأخبار المفضلة يعتمد على مشاركة الأعضاء بالتحكم الكامل بمحتوياته من خلال اضافة الأخبار والتأثير على ترتيبها عن طريق التصويت

2- قول قال

قـــــول قـــــال مجتــمع عربــي للآخبار , قــصص, روابط, افلاام الفيديو و الصــور و التي يقوم المجتمع باختيارها, تقديمها, و التصـــويت عليها دون اي تدخل من إدارة الموقع

3- إفلق

إفلق هو موقع إخباري يعتمد على زواره في إختيار الأخبار والتصويت عليها ونشرها. حيث يملك زوار الموقع مطلق الحرية في إختيار الأفضل ونقله للصفحة الرئيسية من خلال التصويت عليه.

4- المرقاب

موقع متميز لصاحبة محمد الساحلي

المرقاب هو شبكة اجتماعية توفر لأصحاب الاهتمامات المشتركة منصة لمشاركة الروابط لصفحات ويب العربية، التصويت عليها وتقييمها. من جهة أخرى، هو موقع يتيح لمستخدميه إمكانية اكتشاف محتويات عربية منتقاة، بناءً على تفضيلاتهم الشخصية، تفضيلات أصدقائهم، وبناءً على سجل قراءاتهم السابقة على المرقاب.

5- ثبت

احدث تلك السلسة من المواقع والذي ظهر قوي منذ اول يوم له يحتوي علي الكثير من الامكانيات انتجتة شركة إكسيريا لدراسات وحلول الإنترنت exyria Studies

ثبّت، موقع يقدم خدمة اجتماعية افتراضية لاكتشاف أفضل المواقع والصفحات العربية ومشاركة مواضيع الأخبار المختلفة والمدونات المفضلة وغيرها، يتيح ثبّت للمتسخدمين إضافة (ملخصات) عن بعض صفحات الإنترنت وتقييمها صعوداً أو هبوطاً، بالإضافة إلى إمكانية التعبير بفاعلية عن الآراء والاهتمامات بوضع تعليقات وردود حول تلك الصفحات.

يعاب فقط علي تلك الخدمات تكرار المحتوي فيما بينهم, اثناء بحثي في احد المرات تقريبا 3 مواقع من الـ 5 يعرضون نفس المحتوي, وتلك المشكلة ربما يكون سببها المستخدم نفسة فبعض الاشخاص يودون نشر مواقعهم باي شكل فيتجهوا لمثل تلك الخدمات و يضيفوا الروابط فيهم جميعا, لذا يجب علي مطوري تلك المواقع تحويلها الي انظمة زكيه تختار ما يعرض و وقت العرض

في النهاية اتمني الفائدة للمستخدم من تنافس تلك الخدمات.

الصور في الموضوع من خدمة لقطة خدمة وب عربية جديدة مميزة

الان وردبرس يلحق بالركب و يضيف خدمة مماثلة لاعادة نشر التدوينة اللتي تعجبك, الان بامكانك اثناء التجوال في اي مدونة علي wordpress.com اذا اعجبتك تدوينة تضغط علي زر Like في شريط التحكم الخاص بك اعلي الصفحة

ثم يمكنك اعادة نشرها عبر الضغط علي Reblog this post

سوف تنتقل الي الصفحة الرئيسة للموقع و تجد تبويب جديد بعنوان quickpress يعبا  ببيانات التدونة التي اعجبتك من المحتوي و العنوان ورابط للتدوينة الاصلية و ايضا يمكنك اضافة تعليق خاص بك علي التدوينة ثم تختار اي مدونة تنشرها عليها اذا كنت تمتلك اكثر من مدونة

ايضا تلك الصفحة ستظل متاحة و يمكن استعمالها للتدوين

يلاحظ ايضا تبويب جديد بعنوان Posts I like ليحتوي علي كل التدوينات التي سجلت اعجابك بها و يمكنك من خلالة اعادة تدوين اي تدوينة اعجبتك.

تلك الخدمة الجديدة من وردبرس هدفها التسهيل علي المستخدم, سابقا كان اذا اعجب احد بتدوبنة يقوم بـ اضافة رابط لها في مدونتة و يكتب تعليق خاص به الان تتم العملية عن طريق ثلاث ضغطات, ما رايكم في تلك الخدمة

انماط التصميم هيا احسن حلول مقترحة من قبل خبراء لحل مشكلة تصميم متكررة تواجة الكثير من الاشخاص, فتكرار المشاكل اوجد حلول كثيرة لها و تلك الحلول تحول احسنها الي نمط ثابت في حل تلك المشكلة لتعرف فيما بعد بـ انماط التصميم

يحتوي نمط التصميم علي

• اسم
• تعريف بالمشكلة
• متي تحتاج هذا النمط
• الحل المقترح

لتوضويح المفهوم بشكل اكبر لناخذ مثال علي انماط التصميم

الاسم: Tag Cloud – سحابة الاوسمة

المشكلة: المستخدم يريد ان يعرف ما هوا محتوي الموقع بناء علي الاوسمة وما هوا الاكثر استخداما فيه

متي تحتاجة: عندما يكون محتوي الموقع كبير و يحتاج المستخدم معرفة محتوى الموقع بسرعة هل يناسبة ام لا

عندما يريد المستخدم معرفة اكثر المواضيع تكرارا الذي يتحدث عنها الموقع

الحل المقترح: استخدام ما يعرف بـ سحابة الاوسمة

فبمجرد النظر لتلك الصورة في موقع تعلم ان اكثر المواضيع التي يتحدث عنها هيا الاخبار و الموسيقا والتصوير

وهيا تعتمد علي حجم الخط ليتناسب مع اهمية و تكرار المحتوي في الموقع فزيادة الحجم تمثل زيادة تكرارا و شعبية المحتوي المرتبط بالوسم في الموقع

وهيا تكون روابط لصفحة تحتوي علي جميع المواضيع المتعلقة بهذا الوسم

كل هذا  هوا بداية سريعة في مفهوم انماط التصميم للتعرف علي المزيد http://developer.yahoo.com/ypatterns/

دة ملف البرزنتاشن

PPTX: Web Development Not just Code

PPT: Web Development Not just Code

PDF: Web Development Not just Code

اي تعليق اي توضويح مطلوب ياريت الناس تقول

تويتر منصة التدوين المصغر المعروفة كانت تعاني خلال الساعات الفائتة خطأ برمجي اتاح للمستخدمين اجبار اي شخص علي متابعتهم !!

كانت الثغرة في منتهي البساطة مجرد ارسال تويت تبداء بـ كلمة accept ثم “اسم المستخدم” الذي تريدة ان يتابعك

accept [username]


ثم قامت الشركية بالاعلان عن ارجاع عدد المستخدمين الذي تتابعهم و المتابعين لك الي صفر حتي تصحيح الخطأ في الموقع وهذا قد لا يظهر لدي كل المستخدمين قد تظهر الامور عادية لدي بعض المستخدمين

We identified and resolved a bug that permitted a user to “force” other users to follow them. We’re now working to rollback all abuse of the bug that took place. Follower/following numbers are currently at 0; we’re aware and this too should shortly be resolved.

الان يعمل الموقع علي ارجاع كل شيء لطبيعتة وتصحيح الاخطاء في المتابعة الناتجة عن هذا الخطأ

كات سكوب هو مؤتمر يحدث على مدار ثلاث أو أربع أيام و ينظمه فريق الكات, و فى هذا المؤتمر يعطى مهندسين ذو خبرة و محبى أنظمة المعلومات محاضرات تقنية تركز على الIT عامةً و علوم الحاسب و بعضها عن تنمية المهارات الشخصية .

يعتبر كات سكوب تجمع العقول الذكية و النبيهه فى مصر. تتنوع المحاضرات ما بين مستوى المبتدئين الى المحترفين لإتاحة فرصة الإستفادة للجميع, حيث قد تلقى بعض هذه المحاضرات نظرة عامة على تكنولوجيا جديدة أو محاضرة/ورشة عمل متعمقة.

ابتداءً من 12 و حتى 16 مايو 2010 سوف يقام مؤتمر كات سكوب 11, فى قاعة رشاد البدراوى بكلية هندسة, جامعة المنصورة. تحقق من الصفحة الخاصة  بالمحاضرون للتعرف أكثر على الحدث

يمكنك استعراض الجدول للتعرف علي الندوات

تعرف اكثر علي الحدث و المحاضرين و الجوائز وكيفية المساعدة من http://catreloaded.net/scope/

منذ عدة ايام اعلن موقع تويتر عن خدمة أي مكان @Anywhere ، والتي مع سطور قليلة فقط تضيفها لكود موقعك يمكن أن يجلب مجموعة كبيرة من وظائف تويتر الي موقع الويب الخاص بك, بحيث تستطيع علي سبيل المثال تحول كل اسماء المستخدمين @twitter الي روابط لعناوينهم علي موقع تويتر بشكل , وحتى الى انشاء تويت جديدة مباشرة من خلال موقعك الشخصي. سوف احاول اظهار كيفية القيام بذلك ان شاء الله .

قبل البداء في انشاء التطبيق

لكي تبداء في استخدام @Anywhere يجب ان تحصل علي مفتاح لاستخدام الواجهة البرمجية API اذا لم تكن تمتلكة يمكنك الحصول علية من http://twitter.com/apps/new

اعداد الملف الاساسي

في البداية ننشئ ملف html

<html>
<head>
<title>@Anywhere test</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<script src="http://platform.twitter.com/anywhere.js?id=APIKey&v=1" type="text/javascript"></script>
</head>
<body>
……
</body>
</html>

يتم استبدال APIKey بالمفتاح الخاص بك ,لاحظ المتغير v=1 فهو يعبر عن النسخة التي تعمل عليها من الواجهة البرمجية فربما مستقبلا تخرج شركة تويتر بنسخة جديدة وهذا يدعم استمرارية الكود الذي تطورة في العمل

انت الان مستعد للبداء في استخدام @Anywhere لنبداء اضافة محتوي للصفحة

<div id="main">
               <div>
                       <h2>Test Post</h2>
                       <div>
                               <p>This is a test post testing @Anywhere by @twitter it`s me @eslam_mahmoud .</p>
                               <a href="http://twitter.com/eslam_mahmoud" title="eslam_mahmoud">follow me</a>
                       </div>
               </div>
               <div>
                       <h3>Comments</h3>
                       <ol>
                               <li><span>@eslam_mahmoud</span> says:
                                      <p>Great tutorial! </p>
                               </li>

                       </ol>
               </div>
        </div>

تحويل الاسماء الي روابط

توفر @Anywhere اسلوب بسيط لتحويل اسماء المستخدمين علي الشكل @eslam_mahmoud الي روابط اتوماتيكيا بشكل بسيط جدا

twttr.anywhere(function(twitter) {

twitter.linkifyUsers();

});

مجرد اضافة هذا الكود فهو سيقوم بتحوبل الاسماء في كل الموقع الي روابط

يمكنك ايضا تحديد منطقة معينة ليتم التغير فيها عبر اضافة twitter(“AnySelector”).

twttr.anywhere(function(twitter) {

twitter(“.post “).linkifyUsers();

});

توضوح معلومات اضافية عن المستخدم بمجرد الوقوف علي الاسم

و ايضا توفر @Anywhere اسلوب بسيط للقيام بتلك المهمه عن طريق اضافة الكود

twttr.anywhere(function(twitter) {

twitter.hovercards();

});

و ايضا بنفس السهولة يمكن تحديد منطقة معينة يتم التاثير عيلها عن طريق

twttr.anywhere(function(twitter) {

twitter(“.comment”).hovercards();

});

اضافة زر اتبعني Fllow Button

عن طريق دالة followButton()سوف تضيف زر اتبعني او ما يعرف بـ ollowButton كل ما تحتاجة هوا اسم المستخدم و المكان التي ستظهر فيه

الكود التالي سوف يضيف الزر ليتبعeslam_mahmoud بعد وسم #main div

twttr.anywhere(function(twitter) {
twitter(“#main”).followButton(“nettuts”);
});

ـــــــــــــــــــــــــــــــــــــــــــــــــ

هذا الموضوع هوا عبارة عن محاولة توضيح لخدمة شركة تويتر الجديدة للمطورين وهوا يعتبر توضيح بسيط اتمني ان تستفيدوا به

هذا الموضوع بالاعتماد علي net.tuts+, ولا تنسو متابعتي علي تويتر @eslam_mahmoud