feras

Members
  • عدد منشوراتي

    3
  • تاريخ الإنضمام

  • تاريخ اخر زياره

كل منشورات العضو feras

  1. غالبًا سؤالك في لغة جافا أو "سي++" صحيح؟ بشكل عام ال main method هي الدالة الرئيسية التي يستدعيها البرنامج ويقوم بتنفيذ جميع محتوياتها، بعض اللغات تعمل بهذه الآلية تبحث عن الـ main method وتقوم بتنفيذ كل شيء موجود بداخلها. لكن بخصوص الـ parentheses لم أفهم، ربما تقصد الـ Parameters؟ لو كان قصدك الأولى، فهي الأقواص التي يتم تحديد فيها محتويات الدالة function main() { // قوس الفتح // هنا يأتي كل شيء. } // قوس الإغلاق أما إذا كان قصدك الـ Parameters فهي القيم الوسيطة التي تُمرّر للدالة ومثال بسيط على هذا الاستخدام في دوال مُختلفة مثل function add(int num1, int num2) // num1 & num2 هي القيم الوسيطة التي يتم تمريرها للدالة للقيام ببعض العمليات عليها { return num1+num2; // هنا سنعيد ناتج جمع الرقمين المُمرّرين } مثال آخر في لغات أكثر تقعيدًا، في موجّه الأوامر لدينا أمر مثل cd Desktop، صحيح؟ في حقيقة الأمر يُمكن اعتبار cd دالة يتم تمرير Desktop إليها كقيمة، أو أي قيمة أُخرى، وبالتالي يتم تغيير المُجلّد من الحالي إلى الجديد المُمرّر cd Desktop // تخيّل الدالة من الشكل function cd (string[] args) { System.changeDirectory(args[0]) // هنا سيتم أخذ أول قيمة تم تمريرها وتغيير المجلّد إليها // هذا مثال عام وليس عملي }
  2. مستوى الصعوبة: مبتدئ-متوسّط توفّر الشبكات الاجتماعية مكتبات برمجية تسمح الاستفادة من حسابات المُستخدمين في بقيّة التطبيقات، فعوضًا عن إنشاء حساب جديد وتعبئة كافّة البيانات بشكل يدوي، يُمكن للمستخدم اختيار تسجيل الدخول في حسابه في تويتر أو فيسبوك مثلًا لتتم العملية بسهولة تامّة. في NodeJS هناك مكتبة Passport الشهيرة التي تسمح بإنشاء نظام تسجيل دخول اعتمادًا على حسابات المستخدم في الشبكات الاجتماعية، أو حتى يُمكن إنشاء تسجيل دخول عبر البريد. لكن في هذا الدرس سأستعرض آلية إنشاء نظام تسجيل دخول باستخدام تويتر. قبل الخوض في آلية العمل سأشرح الفكرة النظرية. المستخدم أولًا يقوم في فيسبوك أو تويتر، أو حتى غوغل، بإنشاء تطبيق جديد من مركز المُطوّرين Dev Center ليحصل بذلك على رقم مُعرّف خاص بتطبيقه وعلى رمز سرّي يتم إدخالهما في مكتبة Passport لإتمام عملية تسجيل الدخول. الخطوة الأولى بكل تأكيد هي تثبيت المكتبات وإطار عمل ExpressJS كذلك لتسهيل إنشاء الواجهات البرمجية، والمطلوب تحميل التالي: npm install express passport passport-twitter body-parser cookie-parser express-session --save بعدها نقوم بإنشاء برنامجنا البسيط الذي يعرض زر لتسجيل الدخول عبر تويتر بالشكل التالي let express = require("express") let app = express() let PORT = process.env.PORT || 3000 let passport = require("passport") let cookieParser = require("cookie-parser") let session = require('express-session') let bodyParser = require("body-parser") app.use(cookieParser("3alamPro")) app.use(bodyParser.json()) app.use(bodyParser.urlencoded({ extended: false })) app.use(session({secret: "3alamPRO2017", saveUninitialized:true, resave:true})) app.use(passport.initialize()) app.use(passport.session()) require("./configs/passport")(passport) app.get("/", (req, res)=>{ res.send("<a href='/login/twitter'> تسجيل الدخول عبر تويتر </a>") }) app.get("/login/twitter", passport.authenticate('twitter')) app.get("/login/twitter/cb", passport.authenticate('twitter',{successRedirect:"/", failureRedirect:"/loginFail"})) app.listen(PORT, ()=>{ console.log(`Up & Running ${PORT}`) }) الكود السابق بسيط فهو استدعاء لبعض المكتبات الخاصّة بإدارة الجلسات والكوكيز مع تحديد مسارات تسجيل الدخول عبر تويتر، الأول login/twitter الذي سيتوجه المتصفّح له بعد الضغط على الزر. والثاني سيُعيدنا موقع تويتر إليها وهو ما يُعرف بالـ "كول باك" CallBack. الآن نحتاج لكتابة ملف passport.js ضمن مُجلّد congif مثلما هو واضح في الكود أعلاه، وهو الملف الذي سيحتوي على المنطق الخاص بعملية تسجيل الدخول let twitterStrategy = require("passport-twitter").Strategy module.exports = function(passport){ passport.serializeUser(function(user, done) { done(null, user); }); passport.deserializeUser(function(user, done) { done(null, user); }); passport.use(new twitterStrategy({ consumerKey:"هنا المُعرّف الخاص بالتطبيق تحصل عليه من تويتر", consumerSecret:"الرمز السرّي أيضًا من موقع تويتر", callbackURL: "/login/twitter/cb", // المسار الذي سيُعيدنا موقع تويتر إليه }, function(token, tokenSecret, profile, done){ console.log(profile) // هذه بيانات المستخدم من تويتر return done(null, profile) }))// end of Twitter }//end of exports في بداية الملف قُمنا باستدعاء مكتبة تسجيل الدخول في تويتر الخاصّة بمكتبة Passport. ولو رغبت بإنشاء تسجيل دخول عبر فيسبوك فأنت بحاجة لتثبيت واستدعاء مكتبة خاصّة على الشكل let facebookStrategy = require("passport-facebook").Strategy بعدها نحتاج لاستخدام Middleware خاص بالمكتبة الجديدة، وفي مثالنا هو new twitterStrategy مع إدخال بيانات التطبيق، أما الـ "كول باك" فهو سيُعيد لنا أكثر من عنصر من بينها الـ Profile الذي سيحتوي على بيانات المستخدم بعد تحويله إلى تويتر وموافقته على منح صلاحيات للتطبيق. يُمكنك تسميته ما شئت، وفي هذا المكان وعوضًا عن console.log التي استخدمتها أنا بإمكانك مثلًا الاتصال مع قاعدة بيانات لإدخال بيانات المستخدم أو تحديثها إن كانت موجودة ولاتنس شيئين هامّين: الأول هو استخدام return done لأنها تُخبر برنامجنا أن كل شيء يعمل بسلاسة، والثاني هو تعريف passport.serialize وdeserialize لمرّة واحدة فقط لأنها مسؤولة عن إدارة الجلسات الخاصّة ببيانات المستخدم. أخيرًا، كيف يُمكن التأكيد أن المستخدم قام بتسجيل دخول ناجح وبياناته موجودة ضمن الجلسة من عدمها؟ الطريق بسيطة جدًا فقط اختبر القيمة التالية if (req.isAuthenticated()) return "ok" else return "غير مُسجّل للدخول" ماذا لو أردت استخدام فيسبوك مثلًا؟ المنطق بسيط جدًا. تقوم في تعريف المسارات بإضافة التالي app.get("/login/facebook/", passport.authenticate('facebook')) app.get("/login/facebook/cb", passport.authenticate("facebook", {successRedirect:"/", failureRedirect:"/loginFail"})) ومثلما اتفقنا في صفحة passport تقوم بتعريف "ميدل وير" جديد على الشكل passport.use(new facebookStrategy({ clientID:"معرف التطبيق", clientSecret:"الرمز السرّي", callbackURL:"/login/facebook/cb", }, function(token, refreshToken, profile, done){ console.log(profile._json) return done(null, profile._json) }))// end of FB بانتظار الاستفسارات لو كانت موجودة.
  3. مستوى الصعوبة: مبتدئ-متوسّط توفّر الشبكات الاجتماعية مكتبات برمجية تسمح الاستفادة من حسابات المُستخدمين في بقيّة التطبيقات، فعوضًا عن إنشاء حساب جديد وتعبئة كافّة البيانات بشكل يدوي، يُمكن للمستخدم اختيار تسجيل الدخول في حسابه في تويتر أو فيسبوك مثلًا لتتم العملية بسهولة تامّة. في NodeJS هناك مكتبة Passport الشهيرة التي تسمح بإنشاء نظام تسجيل دخول اعتمادًا على حسابات المستخدم في الشبكات الاجتماعية، أو حتى يُمكن إنشاء تسجيل دخول عبر البريد. لكن في هذا الدرس سأستعرض آلية إنشاء نظام تسجيل دخول باستخدام تويتر. قبل الخوض في آلية العمل سأشرح الفكرة النظرية. المستخدم أولًا يقوم في فيسبوك أو تويتر، أو حتى غوغل، بإنشاء تطبيق جديد من مركز المُطوّرين Dev Center ليحصل بذلك على رقم مُعرّف خاص بتطبيقه وعلى رمز سرّي يتم إدخالهما في مكتبة Passport لإتمام عملية تسجيل الدخول. الخطوة الأولى بكل تأكيد هي تثبيت المكتبات وإطار عمل ExpressJS كذلك لتسهيل إنشاء الواجهات البرمجية، والمطلوب تحميل التالي: npm install express passport passport-twitter body-parser cookie-parser express-session --save بعدها نقوم بإنشاء برنامجنا البسيط الذي يعرض زر لتسجيل الدخول عبر تويتر بالشكل التالي let express = require("express") let app = express() let PORT = process.env.PORT || 3000 let passport = require("passport") let cookieParser = require("cookie-parser") let session = require('express-session') let bodyParser = require("body-parser") app.use(cookieParser("3alamPro")) app.use(bodyParser.json()) app.use(bodyParser.urlencoded({ extended: false })) app.use(session({secret: "3alamPRO2017", saveUninitialized:true, resave:true})) app.use(passport.initialize()) app.use(passport.session()) require("./configs/passport")(passport) app.get("/", (req, res)=>{ res.send("<a href='/login/twitter'> تسجيل الدخول عبر تويتر </a>") }) app.get("/login/twitter", passport.authenticate('twitter')) app.get("/login/twitter/cb", passport.authenticate('twitter',{successRedirect:"/", failureRedirect:"/loginFail"})) app.listen(PORT, ()=>{ console.log(`Up & Running ${PORT}`) }) الكود السابق بسيط فهو استدعاء لبعض المكتبات الخاصّة بإدارة الجلسات والكوكيز مع تحديد مسارات تسجيل الدخول عبر تويتر، الأول login/twitter الذي سيتوجه المتصفّح له بعد الضغط على الزر. والثاني سيُعيدنا موقع تويتر إليها وهو ما يُعرف بالـ "كول باك" CallBack. الآن نحتاج لكتابة ملف passport.js ضمن مُجلّد congif مثلما هو واضح في الكود أعلاه، وهو الملف الذي سيحتوي على المنطق الخاص بعملية تسجيل الدخول let twitterStrategy = require("passport-twitter").Strategy module.exports = function(passport){ passport.serializeUser(function(user, done) { done(null, user); }); passport.deserializeUser(function(user, done) { done(null, user); }); passport.use(new twitterStrategy({ consumerKey:"هنا المُعرّف الخاص بالتطبيق تحصل عليه من تويتر", consumerSecret:"الرمز السرّي أيضًا من موقع تويتر", callbackURL: "/login/twitter/cb", // المسار الذي سيُعيدنا موقع تويتر إليه }, function(token, tokenSecret, profile, done){ console.log(profile) // هذه بيانات المستخدم من تويتر return done(null, profile) }))// end of Twitter }//end of exports في بداية الملف قُمنا باستدعاء مكتبة تسجيل الدخول في تويتر الخاصّة بمكتبة Passport. ولو رغبت بإنشاء تسجيل دخول عبر فيسبوك فأنت بحاجة لتثبيت واستدعاء مكتبة خاصّة على الشكل let facebookStrategy = require("passport-facebook").Strategy بعدها نحتاج لاستخدام Middleware خاص بالمكتبة الجديدة، وفي مثالنا هو new twitterStrategy مع إدخال بيانات التطبيق، أما الـ "كول باك" فهو سيُعيد لنا أكثر من عنصر من بينها الـ Profile الذي سيحتوي على بيانات المستخدم بعد تحويله إلى تويتر وموافقته على منح صلاحيات للتطبيق. يُمكنك تسميته ما شئت، وفي هذا المكان وعوضًا عن console.log التي استخدمتها أنا بإمكانك مثلًا الاتصال مع قاعدة بيانات لإدخال بيانات المستخدم أو تحديثها إن كانت موجودة ولاتنس شيئين هامّين: الأول هو استخدام return done لأنها تُخبر برنامجنا أن كل شيء يعمل بسلاسة، والثاني هو تعريف passport.serialize وdeserialize لمرّة واحدة فقط لأنها مسؤولة عن إدارة الجلسات الخاصّة ببيانات المستخدم. أخيرًا، كيف يُمكن التأكيد أن المستخدم قام بتسجيل دخول ناجح وبياناته موجودة ضمن الجلسة من عدمها؟ الطريق بسيطة جدًا فقط اختبر القيمة التالية if (req.isAuthenticated()) return "ok" else return "غير مُسجّل للدخول" ماذا لو أردت استخدام فيسبوك مثلًا؟ المنطق بسيط جدًا. تقوم في تعريف المسارات بإضافة التالي app.get("/login/facebook/", passport.authenticate('facebook')) app.get("/login/facebook/cb", passport.authenticate("facebook", {successRedirect:"/", failureRedirect:"/loginFail"})) ومثلما اتفقنا في صفحة passport تقوم بتعريف "ميدل وير" جديد على الشكل passport.use(new facebookStrategy({ clientID:"معرف التطبيق", clientSecret:"الرمز السرّي", callbackURL:"/login/facebook/cb", }, function(token, refreshToken, profile, done){ console.log(profile._json) return done(null, profile._json) }))// end of FB بانتظار الاستفسارات لو كانت موجودة.
  4. يسعى المُبرمج دائمًا لاختبار تطبيقاته بصورة مُكثّفة وبأكثر من حالة قبل إطلاقها بشكل رسمي. إلا أن هذا لا يعني أن المشاكل لن تحدث، وهنا يأتي دور فريق العمل الذي يحتاج لمراقبة كل شيء عن كثب لتقديم تجربة استخدام مُميّزة، وإلا سيُغادر المستخدم لو وجد الخطأ يتكرّر على فترة زمنية طويلة. في إطار عمل ExpressJS هناك أكثر من طريقة لمراقبة الطلبات والأخطاء الحاصلة في التطبيق، منها مكتبة Morgan التي تقوم بكتابة كل طلب وارد في الكونسول Console، وبالتالي يُمكن معرفة الطلبات الناجحة وتلك التي عادت بـ 404، دلالة على أن المستخدم طلب صفحة غير موجودة. في هذه الحالة يُمكن للقائمين على التطبيق تحليل الطلب ومعرفة فيما إذا كان هناك خطأ بالفعل للتخلّص منه. استخدام المكتبة بسيط جدًا يبدأ بتثبيتها npm install morgan --save بعدها وفي الملف الرئيسي للتطبيق يتم استخدامها بالطريقة الآتية let morgan = require("morgan") app.use(morgan('combined')) وبعد إتمام تلك الخطوات يُمكن مراقبة الكونسول Console وستظهر الطلبات الواردة بهذا الشكل ويُمكن بالمناسبة تغيير combined إلى dev أو tiny لتتغير البيانات التي يتم تدوينها في الكونسول. ماذا عن الأخطاء الأُخرى الحاصلة نتيجة لـ Throw؟ هل سيقضي المُبرمج وقته مُراقبًا ملفات الـ Log أو الكونسول طوال الوقت؟ بكل تأكيد لا لأن أداة AirBrake تأتي لمعالجة هذه المشكلة. تقوم هذه الأداة برصد الأخطاء ومن ثم إرسال تنبيه للمستخدم عبر بريده بشكل فوري، أو عبر حسابات فريق العمل في تطبيق سلاك مثلًا، وبالتالي يضمن المُبرمج أن يطّلع أولًا بأول على المشاكل الحاصلة. طريقة الاستخدام سهلة أيضًا ومُباشرة، تبدأ بالتوجه لموقع الأداة AirBrake.io ثم تسجيل حساب مجاني وإنشاء تطبيق جديد للحصول على مفتاح خاص. ثم يتم تثبيت مكتبة الأداة بالشكل التالي: npm install airbrake-js --save في الملف الرئيسي للتطبيق نقوم بالآتي let airBrake = require('airbrake-js') let ErrorHandler = require('./node_modules/airbrake-js/dist/instrumentation/express') // إنشاء كائن جديد let airBrakeClient = new airBrake({ projectId: 00000, //يتم استبدال الأصفار بالمعرف الخاص الذي ستحصل عليه بعد التسجيل في الموقع projectKey: 'MYKEY' // يتم استبدال المفتاح هذا بالمفتاح الذي يقوم الموقع بتوليده لك }) أخيرًا وقبل الـ Listen يتم إضافة السطر الآتي app.use(ErrorHandler(airBrakeClient)); في هذه الحالة وعند حدوث أي خطأ سيتم التبليغ عبر لوحة تحكّم الموقع أولًا كما هو موضّح في الصورة. مع إمكانية ربط الحساب مع حسابات أُخرى مثلما ذكرت سابقًا لتسهيل التنبيه على الأخطاء.
  5. يسعى المُبرمج دائمًا لاختبار تطبيقاته بصورة مُكثّفة وبأكثر من حالة قبل إطلاقها بشكل رسمي. إلا أن هذا لا يعني أن المشاكل لن تحدث، وهنا يأتي دور فريق العمل الذي يحتاج لمراقبة كل شيء عن كثب لتقديم تجربة استخدام مُميّزة، وإلا سيُغادر المستخدم لو وجد الخطأ يتكرّر على فترة زمنية طويلة. في إطار عمل ExpressJS هناك أكثر من طريقة لمراقبة الطلبات والأخطاء الحاصلة في التطبيق، منها مكتبة Morgan التي تقوم بكتابة كل طلب وارد في الكونسول Console، وبالتالي يُمكن معرفة الطلبات الناجحة وتلك التي عادت بـ 404، دلالة على أن المستخدم طلب صفحة غير موجودة. في هذه الحالة يُمكن للقائمين على التطبيق تحليل الطلب ومعرفة فيما إذا كان هناك خطأ بالفعل للتخلّص منه. استخدام المكتبة بسيط جدًا يبدأ بتثبيتها npm install morgan --save بعدها وفي الملف الرئيسي للتطبيق يتم استخدامها بالطريقة الآتية let morgan = require("morgan") app.use(morgan('combined')) وبعد إتمام تلك الخطوات يُمكن مراقبة الكونسول Console وستظهر الطلبات الواردة بهذا الشكل ويُمكن بالمناسبة تغيير combined إلى dev أو tiny لتتغير البيانات التي يتم تدوينها في الكونسول. ماذا عن الأخطاء الأُخرى الحاصلة نتيجة لـ Throw؟ هل سيقضي المُبرمج وقته مُراقبًا ملفات الـ Log أو الكونسول طوال الوقت؟ بكل تأكيد لا لأن أداة AirBrake تأتي لمعالجة هذه المشكلة. تقوم هذه الأداة برصد الأخطاء ومن ثم إرسال تنبيه للمستخدم عبر بريده بشكل فوري، أو عبر حسابات فريق العمل في تطبيق سلاك مثلًا، وبالتالي يضمن المُبرمج أن يطّلع أولًا بأول على المشاكل الحاصلة. طريقة الاستخدام سهلة أيضًا ومُباشرة، تبدأ بالتوجه لموقع الأداة AirBrake.io ثم تسجيل حساب مجاني وإنشاء تطبيق جديد للحصول على مفتاح خاص. ثم يتم تثبيت مكتبة الأداة بالشكل التالي: npm install airbrake-js --save في الملف الرئيسي للتطبيق نقوم بالآتي let airBrake = require('airbrake-js') let ErrorHandler = require('./node_modules/airbrake-js/dist/instrumentation/express') // إنشاء كائن جديد let airBrakeClient = new airBrake({ projectId: 00000, //يتم استبدال الأصفار بالمعرف الخاص الذي ستحصل عليه بعد التسجيل في الموقع projectKey: 'MYKEY' // يتم استبدال المفتاح هذا بالمفتاح الذي يقوم الموقع بتوليده لك }) أخيرًا وقبل الـ Listen يتم إضافة السطر الآتي app.use(ErrorHandler(airBrakeClient)); في هذه الحالة وعند حدوث أي خطأ سيتم التبليغ عبر لوحة تحكّم الموقع أولًا كما هو موضّح في الصورة. مع إمكانية ربط الحساب مع حسابات أُخرى مثلما ذكرت سابقًا لتسهيل التنبيه على الأخطاء.

عالم البرمجة

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