mirror
/
Front-end-Developer-Interview-Questions
mirror of https://github.com/h5bp/Front-end-Developer-Interview-Questions.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Arabic Translations Added

This commit is contained in:
abo3desa 2017-05-16 13:45:27 +03:00 committed by anas alhmoud
parent cd19da9bda
commit 4fdbf251c9
1 changed files with 289 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

289
Translations/Arabic/README.md Normal file
View File

@ -0,0 +1,289 @@
<div dir="rtl">
<h1>أسئلة مقابله شخصية في تطوير واجهةالويب</h1>
<p>هذا الملف يحتوي على عدد من أسئلة مقابلة شخصية في تطوير واجهة الويب التي من الممكن ان تساعدك في فحص المرشحين المحتملين للوظيفة.
<br>
لا ينصح باستخدام كل الأسئلة هنا على مرشح واحد,
فاختيار بعض من الأسئلة سيساعدك في تحديد من يمتلك المهارات المتوافقه مع متطلباتك.
<br>
<br>
<strong>ملاحظة: </strong>كثير من هذه الأسئلة ليس لها إجابات محددة مما قد يؤدي الى نقاش مثير للاهتمام , و يعرفك على قدرات الشخص أكثر مما تتوقع من اجابة محدده.
</p>
<h2>قائمة المحتوى</h2>
<ol>
<li><a href='#user-content-أسئلة-عامة'>أسئلة عامة</a></li>
<li><a href='#user-content-أسئلة-html'>أسئلة HTML</a></li>
<li><a href='#user-content-أسئلة-css'>أسئلة CSS</a></li>
<li><a href='#user-content-أسئلة-js'>أسئلة JS</a></li>
<li><a href='#user-content-أسئلة-اختبار-البرمجيات-testing'>أسئلة اختبار البرمجيات Testing</a></li>
<li><a href='#user-content-أسئلة-أداء-البرمجيات-performance'>أسئلة أداء البرمجيات Performance</a></li>
<li><a href='#user-content-أسئلة-شبكات-network'>أسئلة شبكات Network</a></li>
<li><a href='#user-content-أسئلة-برمجة'>أسئلة برمجة</a></li>
<li><a href='#user-content-أسئلة-مسلية'>أسئلة مسلية</a></li>
</ol>
<h2>الدخول و المساهمة</h2>
<ol>
<li><a href='#user-content-المساهمون'>المساهمون</a></li>
<li><a href='https://github.com/h5bp/Front-end-Developer-Interview-Questions/blob/master/CONTRIBUTING.md'>كيف تساهم</a></li>
<li><a href='https://github.com/h5bp/Front-end-Developer-Interview-Questions/blob/master/LICENSE.md'>الرخصة</a></li>
</ol>
<h3>أسئلة عامة:</h3>
<ul>
<li>ماذا تعلمت بالأمس/هذا الأسبوع؟</li>
<li>ماذا يهمك ويثير اهتمامك في البرمجة؟</li>
<li>ماهو اخر تحدي تقني واجهته ,و كيف استطعت إصلاحه؟</li>
<li>اي من واجهة المستخدم, الامان, الاداء, قابلية الصيانه, SEO, او اي تقنية تضعها في الحسبان عند بناء تطبيق ويب او موقع؟</li>
<li>تكلم عن بيئة التطوير المفضلة لديك.</li>
<li>ماهو إصدار نظام التحكم المعتاد عليه؟</li>
<li>هل تستطيع وصف روتين عملك عند إنشاء صفحة ويب؟</li>
<li> لو كان لديك خمسة stylesheets مختلفة كيف لك دمجها في الموقع بأفضل طريقة؟</li>
<li>هل تستطيع شرح الفرق بين progressive enhancement و graceful degradation؟</li>
<li>كيف يمكنك تحسين assets/resources الموقع؟</li>
<li>كم عدد المصادر التي يحملها الموقع من domain في وقت واحد؟</li>
<ul><li>ماهي الاستثناءت؟</li></ul>
<li>سم ثلاث طرق لتخفيض تحميل الصفحة؟</li>
<li>لو دخلت الى مشروع و هم يستخدمون tabs وانت تستخدم spaecs, فماذا ستفعل؟</li>
<li>اشرح كيف تنشئ صفحة عرض شرائح.</li>
<li>لو كنت ستحترف تقنية واحده هذه السنه ماذا ستكون؟</li>
<li>اشرح اهمية standards و standards bodies.</li>
<li>ماهو Flash of Unstyled Content ؟وكيف تتفاداه</li>
<li>اشرح ما هو ARIA و screenreaders, وكيف تنشئ موقع accessible؟</li>
<li>اشرح الإيجابيات و السلبيات CSS animations مقابل JavaScript animations.</li>
<li>ماذا CORS يرمز الى ,و ماهي المشكلة التي يعالجها؟</li>
</ul>
<h3>أسئلة HTML:</h3>
<ul>
<li>ماذا تفعل <code>doctype</code>؟</li>
<li>ماهو الفرق بين full standards mode, almost standards mode و quirks mode؟</li>
<li>ماهو الفرق بين HTML و XHTML؟</li>
<li>هل هناك مشكلة في استضافة صفحات<code>application/xhtml+xml</code>؟</li>
<li>كيف تستضيف صفحه بمحتوى متعدد اللغات؟</li>
<li>ماهي الاشياء التي يجب ان تحترس منها عند تصميم او تطور موقع متعدد اللغات؟</li>
<li>ماهي فائدة <code>-data</code>؟</li>
<li>اعتبر HTML5 منصة مفتوحة على شبكة الإنترنت ماهي أسس بناء HTML5؟</li>
<li>اشرح الفرق بين <code>cookie</code>, <code>sessionStorage</code> و <code>localStorage</code>.</li>
<li>اشرح الفرق بين <code>&lt;script&gt;</code>, <code>&lt;script async&gt;</code> و <code>&lt;script defer&gt;</code>.</li>
<li>لماذا من الأفضل وضع سي اس اس <code>&lt;link&gt;</code> بين <code>&lt;head&gt;&lt;/head&gt;</code> و جافاسكربت <code>&lt;script&gt;</code> قبل <code>&lt;body/&gt;</code>؟</li>
<li>ماهو progressive rendering؟</li>
<li>هل استخدمت HTML templating languages مختلفة من قبل؟</li>
</ul>
<h3>أسئلة CSS:</h3>
<ul>
<li>ما الفرق بين class و id في CSS؟</li>
<li>ما الفرق بين "resetting" و "normalizing" في CSS؟ واي منهم ستختار, ولماذا؟</li>
<li>اشرح Floats, و كيف تعمل؟</li>
<li>اشرح z-index, و كيف stacking context شُكلت؟</li>
<li>اشرح (BFC(Block Formatting Context, و كيف تعمل؟</li>
<li>ماهي clearing techniques المختلفه و اي منها مناسب لأي سياق؟</li>
<li>اشرح CSS sprites, وكيف سوف تنفذعم في صفحه او موقع؟</li>
<li>ما هي طرق تبديل الصور "image replacement" المفضلة لديك و متى تسخدم اي منها؟</li>
<li>كيف تصلح مشكلة تنسيق في متصفح معين؟</li>
<li>كيف تجعل صفحاتك تعمل على متصفحات مقيدة بالميزات "قديمة"؟</li>
<ul>
<li>ما هي الطرق/العمليات التي تستخدمها؟</li>
</ul>
<li>ماهي الطرق المختلفة لكي تخفي المحتوى وتجعله فقط متوفر لقارء الشاشه فقط؟</li>
<li>هل استخدمت نظام grid من قبل, و لو كان كذكلك ماذا تفضل؟</li>
<li>هل استخدمت media queries او تنسيق محدد للهاتف؟</li>
<li>هل انت معتاد مع تصميم SVG؟</li>
<li>كيف تحسن صفحاتك لطٌباعة؟</li>
<li>ماهي بعض المعوقات في كتابة CSS جيد؟</li>
<li>ماهي الايجابيات/السلبيات في استخدام CSS preprocessors؟</li>
<ul>
<li>اوصف ماذا يعجبك وما لايعجبك حول استخدام CSS preprocessors؟</li>
</ul>
<li>كيف كيف لك تنفيذ web design comp باستخدام خطوط ليست أساسية؟</li>
<li>اشرح كيف يتسطيع المتصفح تحديد أي عنصر ينتمي إلى أي CSS selector.</li>
<li>اوصف pseudo-elements و ناقش في ماذا يستخدمون؟</li>
<li>اشرح ماهو box model و كيف ستخبر المتصفح تنسيق في box models مختلفة باستخدام CSS.</li>
<li>ماذا <code>{ ;box-sizing: border-box } *</code> يفعل, وماهي ايجابياته؟</li>
<li>عدد كل قيم خاصية display التي تتذكرها.</li>
<li>ما هو الفرق بين inline و inline-block؟</li>
<li>ماهو الفرق بين قيم relative, fixed, absolute و statically في خاصية position؟</li>
<li>الحرف "C" في CSS يرمز الى Cascading. كيف تحدد الافضلية في تعيين التصميم , وكيف لك أن تستفيد من هذه الخاصية؟</li>
<li>أي من إطارات العمل CSS استخدمت في الانتاج أو محليا على جهازك, وكيف لك تغييرهم/تطورهم؟</li>
<li>هل جربت او استعملت قليلا CSS Flexbox او Grid؟</li>
<li>كيف يكون responsive design مختلفا عن adaptive design</li>
<li>هل عملت من قبل مع retina graphics, ولو كان كذلك متى و ماهي الطرق التي استعملتها؟</li>
<li>هل هناك سبب يجعلك من الممكن أن تستعمل <code>()translate</code> بدلا من absolute positioning او vice-versa؟ ولماذا.</li>
</ul>
<h3>أسئلة JS:</h3>
<ul>
<li>اشرح event delegation.</li>
<li>اشرح كيف <code>this</code> تعمل في JavaScript.</li>
<li>اشرح كيف تعمل prototypal inheritance.</li>
<li>ما رأيك في AMD vs CommonJS؟</li>
<li>اشرح لماذا التالي <code>;(){ }{}function foo</code> لا يعمل كـ IIFE؟</li>
<ul>
<li>ما الذي يحتاجه من تصحيح لجعل IIFE بصوره صحيحة؟</li>
</ul>
<li>ما الفرق بين المتغيرات: null, undefined، undeclared؟</li>
<ul>
<li>ما الذي ستفعله لتتحقق من أي من هذه الحالات؟</li>
</ul>
<li>ما هو closure وكيف/لماذا ستستخدم واحدًا؟</li>
<li>ما هي حالة الاستخدام الاعتيادية لـ anonymous functions؟</li>
<li>كيف تنظم برمجياتك؟ (module pattern, classical inheritance)؟</li>
<li>ما الفرق بين host objects و native objects؟</li>
<li>القرق بين <code>{} ()function Person</code>, <code>()var person = Person</code>,و <code>()var person = new Person</code>؟</li>
<li>ما الفرق بين <code>call.</code>و <code>apply.</code>؟</li>
<li>اشرح <code>Function.prototype.bind</code>.</li>
<li>متى تستخدم <code>()document.write</code>؟</li>
<li>ما الفرق بين feature detection, feature inference , واستخدام الـ UA string؟</li>
<li>اشرح Ajax في أكبر قدر من التفاصيل .</li>
<li>ما هي المزايا والعيوب في استخدام Ajax ؟</li>
<li>اشرح كيف JSONP يعمل (وكيف أنها ليست حقا Ajax ).</li>
<li>هل سبق لك استخدام JavaScript templating؟</li>
<ul>
<li>لو كان كذلك أي مكتبة استخدمت؟</li>
</ul>
<li>اشرح "hoisting".</li>
<li>اوصف event bubbling.</li>
<li>ما الفرق بين "attribute" و "property"؟</li>
<li>لماذا extending built-in JavaScript objects فكرة سيئة؟</li>
<li>ما هو الفرق بين document load event و document DOMContentLoaded event؟</li>
<li>ما هو الفرق بين <code>==</code> و <code>===</code>؟</li>
<li>اشرح سياسة same-origin فيما يتعلق بجافاسكربت.</li>
<li>اجعل هذا يعمل:</li>
</ul>
</div>
```javascript
duplicate([1,2,3,4,5]); // [1,2,3,4,5,1,2,3,4,5]
```
<div dir='rtl'>
<ul>
<li>لماذا "Ternary" سميت هكذا ,و ماذا تشير كلمة Ternary expression إلى؟</li>
<li>ماهو <code>;"use strict"</code>, وما هي إبجبايات و سلبيات استخدامه؟</li>
<li>اكتب for loop تكرر حتى 100 و تطبع "fizz" في مضاعفات 3 , و "buzz" في مضاعفات 5 و "fizzbuzz" في مضاعفات 5 و3.</li>
<li>لماذا بشكل عام ترك global scope للموقع كما هو و عدم لمسه فكرة جيدة</li>
<li>لماذا من الممكن تستخدم شي مثل load event, وهل هذا الـevent يملك سلبيات؟ وهل تعرف بدائل.و لماذا من الممكن ان تستخدمهم</li>
<li>اشرح ما هو single page app و كيفية صنع SEO-friendly.</li>
<li>ما مدى خبرتك في استعمال Promises و/او polyfills خاصتهم؟</li>
<li>ماهي بعض المزايا و العيوب في استخدام Promises بدلا من callbacks؟</li>
<li>ماهي بعض الاجابيات و السلبيات في كتابتة جافاسكرت كود في لغة يحدث لها compiles إلى جافاسكربت؟</li>
<li>ماهي الادوات و الطرق التي تستخدمها في البحث و التصحيح عن أخطاءك في الجافاسكربت كود؟</li>
<li>ماهي language constructions تستعمل لتكرار على خواص object و عناصر array؟</li>
<ul>
<li>اشرح الفرق بين mutable و immutable objects.</li>
</ul>
<ul>
<li>ماذا يعتبر في الجافاسكربت لـ immutable object؟</li>
<li>ماهي الايجابيات و السلبيات الـ immutability؟</li>
<li>كيف يمكنك تحقيق immutability في الكود الخاص بك؟</li>
</ul>
<li>اشرح الفرق بين synchronous و asynchronous functions.</li>
<li>ماهو event loop؟</li>
<ul>
<li>ما هو الفرق بين call stack و task queue؟</li>
</ul>
<li>اشرح الفرق في استخدام <code>foo</code> بين <code>{} ()function foo</code> و <code>{} ()var foo = function</code>.</li>
</ul>
<h3>أسئلة اختبار البرمجيات Testing:</h3>
<ul>
<li>ما هي المزايا والعيوب لاختبار برمجياتك؟</li>
<li>ما الأدوات التي تستخدمهافي اختبار وظائف برمجياتك؟</li>
<li>ما الفرق بين اختبار unit واختبار functional/integration؟</li>
<li>ما الغرض من code style linting tool؟</li>
</ul>
<h3>أسئلة أداء البرمجيات Performance:</h3>
<ul>
<li>ما الأدوات التي تستخدمها لإيجاد مشاكل في الأداء؟</li>
<li>ما هي الطرق التي من الممكن تحسن أداءالـ scrolling في موقعك؟</li>
<li>اشرح الفرق بين layout و painting و compositing.</li>
</ul>
<h3>أسئلة شبكات Network:</h3>
<ul>
<li>في العادة لماذا من الأفضل أن ترفع site assets من domains متعدده؟</li>
<li>افعل ما بوسعك لشرح ما يحدث من بداية كتابك عنوان الموقع الى انتهاء تحميله على شاشتك.</li>
<li>ما الفرق بين Long-Polling و Websockets و Server-Sent Events؟</li>
<li>اشرح request and response headers التاليه:</li>
<ul>
<li>الفرق بين If-Modified-... , Expires, Date, Age</li>
<li>Do Not Track</li>
<li>Cache-Control</li>
<li>Transfer-Encoding</li>
<li>ETag</li>
<li>X-Frame-Options</li>
</ul>
<li>ما هي HTTP methods؟ و عدد كل HTTP methods التي تعرفها، واشرحها.</li>
</ul>
<h3>أسئلة برمجة:</h3>
</div>
<p dir="rtl"><em>سؤال: ماهي قيمة <code>foo</code>؟</em></p>
```javascript
var foo = 10 + '20';
```
<p dir="rtl"><em>سؤال: كيف يمكن جعل هذا الكود يعمل؟</em></p>
```javascript
add(2, 5); // 7
add(2)(5); // 7
```
<p dir="rtl"><em>سؤال: ماهي القيمة العائدة من الكود التالي؟</em></p>
```javascript
"i'm a lasagna hog".split("").reverse().join("");
```
<p dir="rtl"><em>سؤال: ماهي قيمة <code>window.foo</code>؟</em></p>
```javascript
( window.foo || ( window.foo = "bar" ) );
```
<p dir="rtl"><em>سؤال: ماهو ناتج التنبيهات التالية؟</em></p>
```javascript
var foo = "Hello";
(function() {
var bar = " World";
alert(foo + bar);
})();
alert(foo + bar);
```
<p dir="rtl"><em>سؤال: ماهي قيمة <code>foo.length</code>؟</em></p>
```javascript
var foo = [];
foo.push(1);
foo.push(2);
```
<p dir="rtl"><em>سؤال: ماهي قيمة <code>foo.x</code>؟</em></p>
```javascript
var foo = {n: 1};
var bar = foo;
foo.x = foo = {n: 2};
```
<p dir="rtl"><em>سؤال: ماذا يطبع الكود التالي؟</em></p>
```javascript
console.log('one');
setTimeout(function() {
console.log('two');
}, 0);
console.log('three');
```
<div dir="rtl">
<h3>أسئلة مسلية:</h3>
<ul>
<li>ماذا عملت من مشروع رائع مؤخرا؟</li>
<li>ما هي الاشياء التي أعجبتك في أدوات التطوير التي تستعملها؟</li>
<li>من الذي يلهمك في مجتمع تطوير واجهة الويب؟</li>
<li>هل لديك اي من المشاريع الصغيرة؟ ما نوعها؟</li>
<li>ما هي الميزة المفضلة لديك في Internet Explorer؟</li>
<li>كيف تحب قهوتك؟</li>
</ul>
<h3>المساهمون:</h3>
<p>بدأت هذه الوثيقة في عام 2009 بتعاون <a href="https://twitter.com/paul_irish">@paul_irish</a> <a href="https://twitter.com/bentruyman">@bentruyman</a> <a href="https://twitter.com/cowboy">@cowboy</a> <a href="https://twitter.com/ajpiano">@ajpiano</a> <a href="https://twitter.com/slexaxton">@SlexAxton</a> <a href="https://twitter.com/boazsender">@boazsender</a> <a href="https://twitter.com/miketaylr">@miketaylr</a> <a href="https://twitter.com/vladikoff">@vladikoff</a> <a href="https://twitter.com/gf3">@gf3</a> <a href="https://twitter.com/jon_neal">@jon_neal</a>.</p>
<p>ومنذ ذلك الحين تلقى مساهمات من أكثر من <a href='https://github.com/h5bp/Front-end-Developer-Interview-Questions/graphs/contributors'>100 مطور.</a></p>
</div>